Как пропорционально увеличить картинку?

Question

[viktorulyushev]

На сайте shopnz.ru/catalog много картинок,они все разных размеров,как увелеичить все картинки немного при этом чтобы оставались такие же пропорции,если задать им фиксированные размеры они все будут под один размер подстраиваться

Comments

[Ярослав Иванов]

.product-categories-item-picture-slim a .product-categories-item-picture-obj-slim {
width: 62%!important;
height: 111%!important;
}

Убрать эту дичь а картинки через background-image подключать

Answer 1

[WhatIsHTML]

Есть два варианта
1. Через background. Картинка растянется по всему контейнеру сохраняя пропорции.

{
background-image: url();
background-size: cover;
}

2. Можно вставлять картинки прямо в тегом , а растягивать через object-fit
https://css-tricks.com/almanac/properties/o/object-fit/
Минус этого метода в том, что высота контейнера должна быть фиксирована. Если она не фиксирована, то используйте первый вариант.