CSS error on front page in product

[Kenneth Berentzen]

Hi, I have a strange error that happens with Firefox initially.
If you look here you might see what I am talking about, one of the pruducts does not get into place in the product grid.

I have added a screenshot so that it´s very clear what I am talking about.

Do you have a fix for this please?

Attachments:

1. 

   Screen-Shot-2014-02-04-at-21.45.50.png
   

[Bill Robbins]

Hello Kenneth,

Thank you for your business first of all. Sorry for the trouble there. It looks like Firefox is calculating one of the items in the first row to have a taller height than the others. That’s pushing the first item in the second row over and bumping the third down to the last row. Let’s try this to fix it:

1. Go to the Theme Options page and select the Advanced tab.
2. Scroll down to the Custom CSS box and paste this:

   
   @media only screen and (min-width: 1024px) {
   
   	.home-product-block li:nth-child(3n+1) {
   	    clear: both;
   	}
   
   }
   

3. Update your settings.

If that doesn’t get it, let me know and if you can send over a link to where you’re working with the theme so I can take a closer look for you.

Thanks,
Bill

[Kenneth Berentzen]

Thanks Bill, amazing speed on this response 🙂 Works like a charm!

[Bill Robbins]

Fantastic. If you need anything else, just let me know.

[Author]

Posts