How to fix product image layouts

HTML & CSS
1

Hello there,

I have my recent products down lower on my homepage here: www.activestatedesigns.com. When a product is on sale, it adds the sale price line below the thumbnail. However when this does that, it pushes the thumbnails out of the grid? Can I get help knowing what CSS code needs to change in order have all the thumbnails fall in the grid and not have those gaps?

Thanks so much,
Lorne

2

On line 680 of defalt.css, change this:

.widget_recentProds .recent_prod_wrap, .widget_bestsellers .bestseller_wrap, .widget_bundle_discounts .bundle_discounts_wrap {
[COLOR="#FF0000"]float: left;[/COLOR]
margin: 0 0 20px 20px;
}

to this


.widget_recentProds .recent_prod_wrap, .widget_bestsellers .bestseller_wrap, .widget_bundle_discounts .bundle_discounts_wrap {
margin: 0 0 20px 20px;
[COLOR="#FF0000"]display: inline-block;
vertical-align: top;[/COLOR]
}

That will work a lot better. :slight_smile:

3

Awesome, thanks Ralph!