У меня есть такая html разметка:
<div class="cart_content__one">
<div class="cart_content__img">
<img src="/img/products_pictures/${item.img}">
</div>
<div class="cart_content__name">${item.name}</div>
<div class="cart_content__price">${item.price}</div>
<div class="cart_content__quantity">
<div class="quantity_minus_plus"><button><i class="fa fa-minus" aria-hidden="true"></i></button></div>
<div><span>${item.quantity}</span></div>
<div class="quantity_minus_plus"><button><i class="fa fa-plus" aria-hidden="true"></i></button></div>
</div>
</div>
Пытаюсь картинки выровнять:
.cart_content__one {
display: flex;
padding: 12px;
gap: 20px;
align-items: center;
}
.cart_content__img {
max-width: 16%;
}
.cart_content__img img {
width: 100%;
display: block;
height: 100px;
object-fit: cover;
}
Но почему-то не срабатывает. Если у картинки большая высота, то она все равно не обрезается