CODEWITHSUNDEEP
csswordpresswoocommerce
UrbExploration
UrbExploration

Reputation: 1

WooCommerce Products Not Displaying in Grid

I'm using WooCommerce with a WordPress theme that hasn't been written to be compatible with the plugin. For the most part I have the CSS working so that the shop looks okay, but I have run into trouble. For some reason, when I go to a category of products, they show up on top of one another, and not in a grid or side by side. I am going nuts trying to figure out how to fix this, and failing.

Page: http://urbexploration.ca/product-category/sanatoriums/

At first, I realized that each < li > (product) had a huge margin on the right, so I took that out with margin-right: 0; but they still are not floating left in a grid. If any code is needed, please let me know. I've been trying to target the < li >tags which have the class 'product'. The < ul > is 'products'.

I've tried 

.products li, .product{ float: left !important; margin-right: 0 !important; }

The ul tag seems to fill the area it should using Google Chrome developer tools, and the li is now sized properly (I think) but it still doesn't float? Or maybe it IS floating and I'm missing something else.

Took clear:both; out of the .excerpt class as suggested, and that seems to be floating them properly.

Upvotes: 0

Views: 2460

Answers (1)

helgatheviking
helgatheviking

Reputation: 26319

To make its own answer:

li.product.excerpt { clear: none; }

would be a good start. The double class selector should make sure the rule is more specific than the problematic .excerpt class itself.

Upvotes: 0

Related Questions