Hey there,

This has been flipping me out. If you have a look here
you'll see this strange ie bug. About every fourth time the page is loaded, some of the bottom link - "Solid Silk Shirt" - appears just after my productPage div.

I've come across this before and read that it's something to do with anchors being too close to the edge of floated divs. The suggested fix was setting a margin or padding, but this doesn't seem to be working for me. It seems to happen to whatever div is last in the productPage div.

Here's the css for the entities involved:

#productPage
{
float:left;
clear:none;
width:640px;
margin-top:10px;
padding:0 5px 3px 3px;
}

The "Goes With" panel:

#relatedProducts
{
float:right;
width:90px;
text-align:center;
margin: 0 3px 10px 0px;
background-image:url(images/navLeftBottom.gif);
background-position:bottom left;
background-repeat:no-repeat;
}

div.panelHead
{
font-weight:bold;
color:#fff;
font-size:12px;
padding:0px 5px 3px 5px;
margin-bottom:2px;
width:90px;
background-image:url(images/navLeftTop.gif);
background-position:top left;
background-repeat:no-repeat;
background-color:#A57EA5;
}
/* Override for IE box model bug */
html>body div.panelHead
{
width:80px;
}

.panelContents
{
width:90px;
text-align:center;
border-right:1px solid #e5e5e5;
border-left:1px solid #e5e5e5;
}
html>body div.panelContents
{
width:82px;
}

.panelProduct
{
float:left;
clear:left;
padding:3px 3px 8px 3px;
width:88px;
}

Can anyone help me with this mania??