Как сделать чтобы все фото товаров отображались одним размером в css?

Question

[4upik]

УРЛ https://luxe.kg/product-category/vanny/
первые 3 товара как-будто скачут)
их исправил вроде так

.item-wrap .item-detail .products-thumb .product-thumb-hover .wp-post-image {
width: 300px;
height: 300px;
}

но для этой страницы не помогло https://luxe.kg/product-category/dushevye/

Answer 1

[Анатолий Куликов]

Для этого нужно указать для стиля .woocommerce img, .woocommerce-page img:
width: 100%;
height: auto;

При этом сами изображения должны быть одного размера изначально. Можно, конечно, указать для изображения и height: 100%, но тогда есть неиллюзорная возможность, что его растянет.

Comments

[Алексей]

https://developer.mozilla.org/ru/docs/Web/CSS/obje...

[Анатолий Куликов]

Если не учитывать пользователей IE, тогда да
https://caniuse.com/#search=object-fit