[Support request] WooCommerce products outside screen – mobile.

[Fredrik]

No difference.

Just a reminder that this code you gave me worked. But since then there were patches that should have fixed it if I recall correctly.

body.woocommerce .wc-columns-container.wc-columns-3 .products {
    grid-template-columns: repeat(3,minmax(0, 1fr));
}

Altough I used it as 2 columns under a breakpoint, and the !important was needed, else it didn’t work.

body.woocommerce .wc-columns-container.wc-columns-3 .products {
    grid-template-columns: repeat(2,minmax(0, 1fr)) !important;
} 

[Tom]

It looks like the minmax part of it didn’t make it into our update for some reason – that’s my fault, sorry!

I’ll definitely get that added in 1.10.

[Fredrik]

Great! 🙂

[Sebastian]

Hi Tom + Team,
just want to add to this:
I have the same problem on my site and I have the columns on mobile set to 1.
Tablet 2 columns, PC 3 columns.
When resizing on a PC it all looks fine but on mobile I have 3 columns and a scrollbar to reach them.
I will wait for the 1.10 update and see if it fixes that and if I have to add some of the CSS you mentioned.
Just wanted to add that it isn’t just with Fredriks’ site, but with mine too.
For your reference site is here

[Tom]

Hi Sebastian,

This almost looks like a different issue – the one column isn’t working at all. Any chance you can open up a new topic?

Thanks!

[Author]

Posts