我的媒体查询不适用于此div .col-3,尽管它确实适用于其他人。
是否有问题?@media screen and (min-width: 600px) and (max-width: 719px) {
.col-3 {
flex: 0 50%;
max-width: 50%;
}
}
<div class="row fade show">
<div class="col-3">
<div class="ProductBox_root__13DPQ">
<div class="ProductBox_photo__Xs8BM"><img
src="https://images.pexels.com/photos/245208/pexels-photo-245208.jpeg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260"
alt="Aenean Ru Bristique 1" class="ProductBox_image__1ECK5">
<div class="ProductBox_sale__1WcD7">sale</div>
<div class="ProductBox_buttons__uyJNx"><a href="#" class="Button_small__2W39u">Quick View</a><a href="#"
class="Button_small__2W39u"><svg aria-hidden="true" focusable="false" data-prefix="fas"
data-icon="shopping-basket" class="svg-inline--fa fa-shopping-basket fa-w-18 " role="img"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path fill="currentColor"
d="M576 216v16c0 13.255-10.745 24-24 24h-8l-26.113 182.788C514.509 462.435 494.257 480 470.37 480H105.63c-23.887 0-44.139-17.565-47.518-41.212L32 256h-8c-13.255 0-24-10.745-24-24v-16c0-13.255 10.745-24 24-24h67.341l106.78-146.821c10.395-14.292 30.407-17.453 44.701-7.058 14.293 10.395 17.453 30.408 7.058 44.701L170.477 192h235.046L326.12 82.821c-10.395-14.292-7.234-34.306 7.059-44.701 14.291-10.395 34.306-7.235 44.701 7.058L484.659 192H552c13.255 0 24 10.745 24 24zM312 392V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24zm112 0V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24zm-224 0V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24z">
</path>
</svg> ADD TO CART</a></div>
</div>
选择器/类?让我确认我已添加,因此必须是其他内容。
图像溢出了容器?
img{ width: 100% }