CSS Rembourrage indésirable dans IE en utilisant des flotteurs

Question

Cela a été une longue journée de conception et j'ai rencontré un problème aujourd'hui. Le site Web www.dcninc.com/newtest/security_testing.php est un nouveau design sur lequel je travaille actuellement. Si vous l'affichez dans Firefox, vous remarquerez qu'il n'y a pas de rembourrage sur les 2 cases droites (je l'ai fait exprès pour résoudre mon problème) Cependant si vous regardez cette même page dans IE, il ajoute un rembourrage à droite côté. Voici mon CSS et HTML ci-dessous.

• http://pastebin.com/hRxZp9ub
• http://pastebin.com/YwSYn7ti

Answer 1

Essayez d'ajouter à l'en-tête

<!--[if lt IE 8]> 
    <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script> 
<![endif]--> 

Answer 2

Vous avez des éléments imbriqués les uns dans les autres qui ont des largeurs de 250.

Comme ça,

<table width="250"><tr width="250"></tr><table width="250"></table></table> 

Depuis, il y a eu une certaine largeur utilisé avec rembourrage, il n'y a pas 250 pixels de espace libre pour vous de mettre à l'intérieur de la table. Je voudrais essayer d'abaisser la largeur des éléments internes de 10-20 pixels.

Espérons que cela aide. Voici le balisage je référencement,

<table border="0" cellpadding="0" cellspacing="0" width="250"> 
<tr> 
<td width="250" height="9" style="background:url(Images/right_box_gray_top.png) no-repeat;"></td> 
</tr> 
<tr> 
<td style="background:url(Images/right_box_gray_middle.png) repeat-y" width="250"> 
<div class="list-right-info"> 
<table border="0" cellpadding="0" cellspacing="0" width="250"> 
<tr> 
<td width="40"><img src="Images/icons/phonepic.jpg" border="0" /></td> 
<td><center>CALL US TODAY<br /> 800.xxx.xxxx</center></td> 
</tr> 
<tr> 
<td></td> 
<td></td> 
</tr> 
</table> 
</div> 
</td> 
</tr> 
<tr> 
<td style="background:url(Images/right_box_gray_bottom.png) no-repeat" width="250" height="108"></td> 
</tr> 
</table>