Problem Page Product with Mobile Google Chrome and Safari, no FireFox

Hi there,

It looks like the mobile stylesheet for WooCommerce is missing. Can you try disabling WP Rocket to see if it's causing the issue?

Hi Tom
Perfect ! It's WP Rocket.
I search the just configuration for this web site !
Thank you :)
Have a nice day

I must desactive this option for mobile to see perfect, only for Chrome/Safari Mobile !!?? : https://ibb.co/7t02CL7
It's strange...

you can add this in the css:

@media (max-width: 767px) {
.generate-columns {
padding-left: 0 !important;
}
}

and activate wp-rocket for mobile, it worked for me !

Thank CCL Live, but this solution don't work for me :(

Tom, i must contact WP Rocket Support or have you a solution with CSS ?

Thank you

Hi there,

it would be best to raise the issue with WP Rocket as its there plugin that is causing the issue.

You can of course try forcing the columns with some CSS like so:

@media(max-width: 768px) {
    .woocommerce .wc-columns-container.wc-columns-3 .products {
        -ms-grid-columns: (1fr)[2] !important;
        grid-template-columns: repeat(2,1fr) !important;;
    }
}

Thank you David OK, i contact the support WP Rocket.
But this CSS don't change the style, i have the same problem.

Where did you add the CSS?
Could re-add it and clear your cache. Let me know.

Is on CHILD and Apparence directly for test to : https://ibb.co/0ZvNx8C
I have clear all cache.

You may need to use a child theme style.css or our "Simple CSS" plugin to add it. Looks like the Customizer needs to be updated to allow some CSS Grid attributes.

Yes Tom I have just test in Apparence.
it's in my Child Theme :)
But nothing change

Hi
This is an option of WP Rocket the trouble : "Optimiser le chargement du CSS"
I must desactive this and it's work :)

Thank you for your help.

Have a nice day

Glad you got it sorted :)