Archived topic
Reduce woocommerce product grid spacing
5 replies · Started by Manoj on March 29, 2019
Hello,
Is there a simple way to control space between woocommerce product listing.
The default spacing is too wide and I need to reduce that. Any help would highly be appreciated.
Hi there,
In 1.7.8 it's kind of hard to do this, as it uses floats.
However, if you update to 1.8, we use CSS Grid so it's way easier: https://generatepress.com/gp-premium-1-8/
It's in public testing right now, but it's quite stable. Let me know if you update and I'll help with the CSS :)
Hi Tom,
Thank you for revert back.
Yes, we have updated to 1.8.0 (Beta), so please help us to how to adjust the spacing please.
Best Wishes
Any chance you can clear your caching plugin? I'm still seeing the older version.
I'm sorry for that. The caching plugin is disabled now.
Also we are using shortcode on homepage to display featured products.
Ah, the shortcode won't use our CSS Grid, so we need to stick with their funky percentages.
Try this:
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
width: 23.05%;
margin-right: 1.95%;
margin-bottom: 1.95%;
}