Best sellers box in firefox

[busymum]

Hello, I'm having a problem with the best sellers box in firefox. It looks fine in IE, but it looks broken in firefox. I've looked in the css to see if there is extra padding and taken that out, not making any difference. Any help would be appreciated. Site (not live) is http://www.pool-equipment.co.uk/index.php

For the right side boxes, i've used some extra styles in the style sheet to get them to look that way. All look fine in IE, and all except bestsellers look fine in Firefox. Thanks.

This is what I have for the right side boxes:
/*sidebox headers right*/
#crsnavwrap
{
float: left;
width: 192px;
padding-right: 2px;
padding-top: 2px;
}

#reviewsHeading
{
height : 35px;
color : white;
text-align:center;
background-image: url(http://www.pool-equipment.co.uk/imag...-heading.gif);
background-repeat: no-repeat;
vertical-align: middle;
}
#searchHeading
{
height : 35px;
color : white;
text-align:center;
background-image: url(http://www.pool-equipment.co.uk/imag...-heading.gif);
background-repeat: no-repeat;
vertical-align: middle;
}

#searchContent, #manufacturersContent, #shoppingcartContent, #reviewsContent, #bestsellersContent
{
vertical-align: top;
width: 192px;
padding: 0px;
margin: 0;
color : black;
background-image: url(http://www.pool-equipment.co.uk/images/rightmid.gif);
background-repeat: repeat;
}

#searchBottom, #manufacturersBottom, #reviewsBottom, #bestsellersBottom
{
vertical-align: top;
color : white;
height: 20px;
width: 192px;
background-image: url(http://www.pool-equipment.co.uk/imag...h-bottom.gif);
background-repeat: no-repeat;

}


#manufacturersHeading
{
height : 35px;
color : white;
text-align:center;
background-image: url(http://www.pool-equipment.co.uk/imag...-heading.gif);
background-repeat: no-repeat;
vertical-align: middle;
}



#shoppingcartHeading
{
height : 35px;
color : white;
text-align:center;
background-image: url(http://www.pool-equipment.co.uk/imag...-heading.gif);
background-repeat: no-repeat;
vertical-align: middle;
}


#shoppingcartBottom
{
vertical-align: top;
color : white;
height: 20px;
width: 192px;
background-image: url(http://www.pool-equipment.co.uk/imag...t-bottom.gif);
background-repeat: no-repeat;

}
#bestsellersHeading
{
height : 35px;
color : white;
text-align:center;
background-image: url(http://www.pool-equipment.co.uk/imag...-heading.gif);
background-repeat: no-repeat;
vertical-align: middle;
}

AND this is what I have for the best sellers further down.
#bestsellers .wrapper {
margin: 0em 0em 0em 1.5em;
padding: 0;

}

#bestsellers ol {
padding: 0;
margin-left: 1.1em;
}

#bestsellers li {
padding: 0;
margin: 0.0em 0em 0.0em 0em;
}

[niccol]

There is something a bit wrong in the html source of the page. The table that is in the bestsellers box looks like:

<table width="162" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom" id="bestsellersHeading"></h3></td>
</tr>
<tr><td valign="top">
<div id="bestsellersContent" class="bestsideBoxContent">

<div class="wrapper">
<ol>
<li><a href="http://www.pool-equipment.co.uk/index.php?main_page=product_info&amp;products_id=2&amp;zenid=d0f2118f177b91942188e10dc8e07cb3">Clarifier Tabs</a></li>
<li><a href="http://www.pool-equipment.co.uk/index.php?main_page=product_info&amp;products_id=1&amp;zenid=d0f2118f177b91942188e10dc8e07cb3">AGP Starter</a></li>
</ol>
</div>
</div></td>
</tr>
<tr><td valign="top" id="bestsellersBottom"><img src="../images/pixel_trans.gif" /></td>
</tr></table>

There is at least on extra </h3> tag in there. I suspect there is an error in the sidebox code. I am guessing but has this sidebox been edited or is part of a purchased template? You need to make sure the html will validate and then we can work on display inconsistencies. It may not be the end of the issue but it needs to be sorted out :-)

It might help to post your file:

tpl_best_sellers.php

Nik