Как сделать картинки адаптивными не зависимо от их разрешения?

Question

[Палтос]

На сайте каруселька с анонсами, допустим выводится по 3 анонса (они растягиваются по 30% от ширины экрана), в них есть картинки разного разрешения. Как сделать что бы все картинки были размером в соотношении 16:9 например (без деформации) ? Если задавать фон анонсам, по идеи должно получится (но в этом есть минусы). вот пример https://jsfiddle.net/7js9wg26/

Answer 1

[Денис Васильев]

https://jsfiddle.net/mrnobody/7js9wg26/5/

Comments

[Палтос]

спс) то что надо.
а что с 1м анонсом? отступы какие то вверху. это из-за длины заголовка, как этот баг убрать ?

[Палтос]

[Палтос]

Без object-fit не обойтись ? боюсь за поддержку

[Денис Васильев]

https://jsfiddle.net/mrnobody/7js9wg26/9/
Вроде нет (

[Палтос]

Денис Васильев, спасибо ) ладно, ничего страшного даже если object-fit у кого то не работает, поломка будет незначительная...