Archived topic
2 Product columns on mobile
11 replies · Started by Pedro on March 8, 2019
Hello! I have configured GP Premium to show 2 columns of products for the mobile version.
However, for some strange reason, products are sometimes shown in 1 column. That happens with small screen phones (iPhone 6S - 4.7")
Since I have tried on larger screen devices and this does not happen.
I send you a screenshot to better explain what I say:
https://www.dropbox.com/s/2ob3rtevsc38v0g/IMG_2229.PNG?dl=0
How can I solve that?
Hi there,
Is this happening on all pages?
I just view a few (also have an iPhone 6s) and all of them show 2 columns on mobile.
Also couldn't get it to happen using browser resize.
Hi leo! Thanks for answering.
It does not happen on all pages, only on some pages.
Can you specify which pages so I know what to look at?
Hi leo! Of course.
One of the pages on which this happens is:
https://www.celuganga.co/producto/funda-antigolpes-ultra-resistente-para-iphone/
It is shown with the upsells / related products.
Can you try disabling the caching plugin?
And please always do so when we are trying to debug :)
Hi leo!
I have already disabled WP Rocket. Sorry!
Hi leo!
Could you check the problem? I'm careful
Hi leo!
Because I did not receive a response from you, I had to enable the cache plugin again.
When you are available to help me, please let me know.
Strange, looks like a possible bug.
Does this CSS fix it?:
@media (max-width: 768px) {
.woocommerce-page .related ul.products li.product:nth-child(3n),
.woocommerce-page .up-sells ul.products li.product:nth-child(3n) {
clear: left !important;
}
}Hello Tom!
You are a magician! That code solved it 100% Thanks!
You're welcome. This will be fixed in GPP 1.8 as we're switching the columns to CSS Grid :)
