Tagged: enfold, grid, Product, woocommerce
On my site, I have several product grids on the same page.
Some are working properly, and display 4 columns as specified in the settings.
But others display only 3 columns instead of 4, and wrap after 3 items are displayed. I’ve changed the sort order of the products, and this makes no difference.
Can you advise what is going wrong with the column display? It used to work perfectly in previous versions, and no changes were made on the page.
Hey JuergenB,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
.products .product.first {
clear: none;
}
If you need further assistance please let us know.
Best regards,
Victoria
HI Victoria
Thanks for your help! That almost worked, the third column is now shown in the right place, but the column butts up right against the third column, with no column spacing. I was able to fix this by adding a padding-left:1% statement, and on the surface, this fixes the issue. However, I still don’t think this is a permanent/correct way to address this:
I don’t feel this is a CSS issue, but a code issue where the 3rd column acts as the “last column” and causes the wrap. I think there is something else going on with the Woocommerce product grid code, and addressing this with CSS is more of a workaround than a fix.