Мой атрибут ширины переопределяет подгонку объекта: содержать - PullRequest
0 голосов
/ 03 мая 2020

Я занимаюсь разработкой информационной доски для моего университетского клуба. Я почти завершил его, за исключением того, что у меня осталась одна досадная ошибка: центральное изображение расширяется под окном просмотра.

Предполагается, что изображение сжимается и расширяется, чтобы оставаться между двумя боковыми столбцами, что и происходит из-за атрибута width css в процентах. Тем не менее, я бы хотел, чтобы он не расширялся дальше, когда нижняя часть изображения соприкасается с нижней частью области просмотра; он просто должен оставаться по центру.

Для моей жизни я не могу найти решение, которое остановит его рост за пределы нижней части страницы без искажения соотношения сторон изображения.

Я думал, что что-то с object-fit: contain, но, увы, кажется, ширина всегда будет иметь приоритет над object-fit.

Любая помощь будет высоко ценится, так как я довольно new to web dev.

Вот ссылка на клиентское представление того, что у меня есть: https://jsfiddle.net/ydumcrnk/

1 Ответ

0 голосов
/ 03 мая 2020

Вы смотрели на дисплей: гибкий? Вы можете обернуть div вокруг трех классов .column, дать этому контейнеру div свойство display: flex, а затем вы можете добавить некоторые последующие свойства, которые будут выстраивать классы .column так, как вы хотите.

Вот страница, на которую я часто ссылаюсь.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...