Hi,

I have found a very strange bug in my css layout.

I have a 3 x 3 products table. The styling is really simple, just 9 list items, styled as
Code:
display:block, float: left; width: 32%
Everything works perfectly across all modern browsers.

However, I have been experiencing a strange bug. Every now and then the 3x3 table breaks.

Here is the image:

Screen Shot 2012-03-17 at 10.27.19 PM.png

List item 7 is the white watch, 8 is the blue watch and 9 is the golden watch.

Sometimes this appears between the 1st and 2nd rows, and sometimes it appears between the 2nd and 3rd rows. More so, sometimes everything loads fine, without the break.

I have reproduced this bug on Safari and Mozilla, so I'm guessing this is a gecko related bug. More so, this never happens when I F5 the page. So I get the feeling this happens when the browser starts pulling files from its cache.

Any ideas on what is going on here and how to fix this?