CSS bizarre en IE et FF

Bonjour,
Voilà, j'ai crée(enfin c'est mon but de le créer) un petit menu déroulant avec HTML/CSS/Javascript comme de coutume.

Le truc c'est que sous FF cela fonctionne parfaitement et que sous IE ben cela fonctionne aussi, mais pas parfaitement ;) :sleep:
le CSS
/*MISE EN PAGE DU MENU*/
<ital>.menucell{
margin: 0;
padding: 0;
float: left;
/*border: 1px solid #000000;*/
border-width: 1px 0;
text-align: center;
font-family: Arial;
font-size: 13px;
font-weight: bold;
margin-left: 20px;

}
/* POSITION DU MENU PRINCIPAL */
.menucell dl{
padding:0px;
margin-top: 8px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
float: left;
width: auto;
z-index:100;


}
.menucell dt{
display: inline;
color: white;

}

.menucell dt a{
float: left;
color: white;
font-weight: bold;
text-decoration: none;
border-right: 1px solid white;
background:none;
top: 0px;
padding-top: 4px;
padding-right: 11px;
padding-bottom: 4px;
padding-left: 11px;

}

.menucell dt a:visited{
color: white;
font-weight: bold;
}

.menucell dt a:hover, .menucell dt .current{
color: white;
font-weight: bold;
background: transparent url(css/images/fondmenu-press.png) center center repeat-x;
}

.menucell dd {
display: none;
border: 1px solid gray;
position: absolute;
padding: 0px;
margin-top: 30px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
background-color:#FFFFFF;
z-index: auto;
}

le Javascript
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>

et le html
<div class="menucell">
<dl>
<dt onmouseover="javascript:montre('smenu1');"><a href="#">Menu 1</a></dt>
<dd id="smenu1" onmouseover="javascript:montre('smenu1');" ondblclick="javascript:montre('');">SM 1</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu2');"><a href="#">Menu 2</a></dt>
<dd id="smenu2" onmouseover="javascript:montre('smenu2');" ondblclick="javascript:montre('');">SM 2</dd>
</dl>

</div> </ital>


Alors sous FF, les Sous Menu s'affichent en pile en dessous du Menu(du block DT) mais sous IE7 ils s'affiche sur la droite du block DT des Menus?

Pouvez-vous m'expliquer?

Mici