[Resolved] How to adjust white space between product images on Woocommerce Shop Page?

[bluebit]

I’d like to reduce the white space in between the product images also known as the gutter space on the Woocommerce Shop Page, how do I do this?

[David]

Hi there,

this CSS will reduce the grid gap:

.wc-columns-container .products,
.woocommerce .related ul.products,
.woocommerce .up-sells ul.products {
    grid-gap: 20px;
}

[bluebit]

thank you that worked, ok so its also called grip gap, cool 🙂

[David]

GP uses CSS Grid for the Woo columns, so it only applies there – can’t just add it to any type of layout 🙂

You’re welcome

[Author]

Posts