Docs

[Noellemena]

Hey!
My client wants to have more space between her products in her store, she feels it is a little crowded. I have scoured around the forum looking for some CSS to adjust it but cannot find it. It would need to also effect the category pages for the store as well. Attaching screenshot.

NOTE: I had tried this:

.woocommerce-page li.product {
margin: 0 2% 5% 0;
}

But anything above that 2% just makes it one column.

Thanks!!
Noelle

[Prasant Rai]

Hello Noelle,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[Noellemena]

This reply has been marked as private.

[Friech]

Hi Noelle,

Thank you for the credentials, increasing the column margin means reducing its width. Please try this code instead.

.woocommerce .cols-2 li.product,
.woocommerce.columns-2 li.product {
	 width: 46%;
}
.woocommerce-page li.product {
	margin: 0 8% 8% 0;
}

Feel free to adjust the value, just make sure the sum of two columns plus the right margin does not exceed to 100%.

Let us know how it goes.

Cheers!

[Author]

Posts