Displaying 2 products/2 collections per row

Technical Q&A
, ,
1

How can I display 2 collections and 2 products per row on mobile? Currently it only displays 1 collections/ 1 product per row.

url: https://hawthornlighting.com/

2

hello @frankboykin55

@media screen and (max-width: 749px) {
.collection-list .collection-list__item, body .product-grid .grid__item {
    width: calc(50% - 3rem) !important;
}
}

Go to theme → edit code → base.css

and put this above code in base.css

2 Likes
3

You magical human, you. Thank you so much! You’re a genius!

4

Hi! @oscprofessional

I have this same issue with my website on mobile.

I would also like to display 2 products per row.

Website is https://bohandivy.co.nz/

And theme is ‘Grid’

I’ve been trying different codes but none of them seem to work for my website.

Would you have any suggestion for me?

Kind Regards,

Ivonne

Boh& Ivy