У меня есть следующий простой код:
Код: Выделить всё
img {
width: 150px;
height: 100px;
border: 1px solid #000;
margin: 10px 0;
}
.narrow {
width: 100px;
height: 150px;
}
.fill {
object-fit: fill;
}
Код: Выделить всё
object-fit: fill
[img]https://placehold.co/800x1000[/img]
[img]https://placehold.co/800x1000[/img]
Мое изображение не растягивается по длине и ширине элемента img . Почему мое изображение не растягивается в обоих направлениях, но сохраняет соотношение сторон и как его растянуть? спасибо!
Изменить. Чтобы уточнить, я хочу, чтобы изображение было растянуто, а не обрезано по размеру. Так что object-fill: Cover не поможет -
Для справки
cover
Замененный контент имеет размер, позволяющий сохранить соотношение сторон при
заполнении всего поля содержимого элемента. Если соотношение сторон объекта
не соответствует соотношению сторон его блока, то объект будет
обрезан по размеру.
fill
Замененное содержимое имеет размер, соответствующий заполнению поля содержимого элемента.
Весь объект полностью заполнит поле. Если соотношение сторон
объекта не соответствует соотношению сторон его блока, то объект будет
растянут по размеру.
Подробнее здесь: https://stackoverflow.com/questions/787 ... stretch-it