Задача: пропорції для зображень 19/6
.picture { display: block; width: 100%; height: auto; position: relative; overflow: hidden; padding-top: 56.25%; } .picture picture { display: block; width: 100%; max-height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .picture picture img { width: 100%!important; height: 100%!important; object-fit: cover; }
І html:
<div class="picture"> <picture> <img src="temp/900-300.png" alt=""> </picture> </div>
PS. aspect-ratio: 19/6 не підримує Safari for IOS, тому ліпше оцей "дідівський метод".