How to reduce this gap between the two columns of the products on mobile device (https://prnt.sc/vquOXBdN70Dj). This is so unpretty and almost all the demos’ shop page (when 2 columns layout) look like this. I tried putting the following codes:
@media only screen and (max-width: 480px)
.products-grid .product {
width: 50%;
padding-left: 5px;
padding-right: 5px;
}
in the Additional CSS, but it doesn’t work. I really appreciate if you could spare me some functional codes. I’d like to share my administrative info if it’s necessary.