Probleme de menu deroulant sous IE

Bonjour,

J'ai utilisé pour faire un menu déroulant le menu suivant :
http://tutorials.alsacreations.com/deroulant/menu-horizontal.htm
J'ai reussi a la faire marché sous Firefox, mais sous IE les images de mon menu (du premier niveau) se mettent les unes sous les autres...
Voici le code utilisé:

Dans la CSS :

/* CSS Document */



body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
 text-align: center; /* pour corriger le bug de centrage IE */
}
dl, dt, dd, ul, li {
margin: 0px;
padding: 0px;
list-style-type: none;
}




#menu {
position: relative; /* on positionne le conteneur */
     margin-left: auto;
     margin-right: auto;
     width: 580px;
     text-align: left;
}
#menu dl {
float: left;


}
#menu dt {
cursor: pointer;




}
#menu dd #smenu1 {
position:absolute;
left: 0px ;
top: 40px ;

}

#smenu1 {
position:absolute;
left: 0px ;
top: 40px ;

}
#smenu2 {
position:absolute;
left: 100px ;
top: 40px ;

}
#smenu3 {
position:absolute;
left: 200px ;
top: 40px ;

}
#smenu4 {
position:absolute;
left: 300px ;
top: 50px ;

}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}

#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;

 
}

a {text-decoration: none;

}

Dans le BODY :

<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td>	
<div id="menu">
	
	
	<dl>			
		<dt onmouseover="javascript:montre('smenu1');"><a href="http://hec.prod.synopsis.ca/index.php?id=2" onMouseOver="affiche_info(),rollover(ainformation,'ainformation_hover.jpg',ainformation1,'ainformation1_hover.jpg',ainformation2,'ainformation2_hover.jpg');" onMouseOut="diparait_info()rollout(ainformation,'ainformation.jpg',ainformation1,'ainformation1.jpg',ainformation2,'ainformation2.jpg');"><img name="ainformation" src="images/ainformation.jpg" width="161" height="31" border="0" alt=""></a></dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">Sous-Menu 1.1</a></li>
					<li><a href="#">Sous-Menu 1.2</a></li>
					<li><a href="#">Sous-Menu 1.3</a></li>
					<li><a href="#">Sous-Menu 1.4</a></li>
					<li><a href="#">Sous-Menu 1.5</a></li>
					<li><a href="#">Sous-Menu 1.6</a></li>
				</ul>
			</dd>
	</dl>
	
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu2')"; onmouseout="javascript:montre('');"><a href="http://hec.prod.synopsis.ca/index.php?id=3" onMouseOver="affiche_pub(),rollover(apublications,'apublications_hover.jpg',apublications1,'apublications1_hover.jpg',apublications2,'apublications2_hover.jpg');" onMouseOut="diparait_pub(),rollout(apublications,'apublications.jpg',apublications1,'apublications1.jpg',apublications2,'apublications2.jpg');"><img name="apublications" src="images/apublications.jpg" width="98" height="31" border="0" alt=""></a></dt>
			<dd id="smenu2">
				<ul>
					<li><a href="#">Sous-Menu 2.1</a></li>
					<li><a href="#">Sous-Menu 2.2</a></li>
					<li><a href="#">Sous-Menu 2.3</a></li>
					<li><a href="#">Sous-Menu 2.4</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu3');"><a href="http://hec.prod.synopsis.ca/index.php?id=4" onMouseOver="affiche2(),rollover(aformation,'aformation_hover.jpg',aformation1,'aformation1_hover.jpg',aformation2,'aformation2_hover.jpg');" onMouseOut="diparait2(),rollout(aformation,'aformation.jpg',aformation1,'aformation1.jpg',aformation2,'aformation2.jpg');"><img name="aformation" src="images/aformation.jpg" width="117" height="31" border="0" alt=""></a></dt>
			<dd id="smenu3">
				<ul>
					<li><a href="#">Sous-Menu 3.1</a></li>
					<li><a href="#">Sous-Menu 3.2</a></li>
					<li><a href="#">Sous-Menu 3.3</a></li>
					<li><a href="#">Sous-Menu 3.4</a></li>
					<li><a href="#">Sous-Menu 3.5</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu4');"><a href="http://hec.prod.synopsis.ca/index.php?id=5" onMouseOver="rollover(aactivite,'aactivite_hover.jpg',aactivite1,'aactivite1_hover.jpg',aactivite2,'aactivite2_hover.jpg');" onMouseOut="rollout(aactivite,'aactivite.jpg',aactivite1,'aactivite1.jpg',aactivite2,'aactivite2.jpg');"><img name="aactivite" src="images/aactivite.jpg" width="170" height="31" border="0" alt=""></a></dt>
		  <dd id="smenu4">
			  <ul>
				  <li><a href="#">Sous-Menu 4.1</a></li>
				  <li><a href="#">Sous-Menu 4.2</a></li>
				  <li><a href="#">Sous-Menu 4.</a></li>
			  </ul>
			</dd>
	</dl>
	
</div>
  <td height="31" valign="top"><img src="images/recherche.jpg" width="62" height="31"></td>
          <td width="151" valign="top" id="searchBox"><img src="images/textarea.jpg" width="125" height="31"></td>
          <td valign="top" ><img src="images/right_recherche.jpg" width="7" height="31"></td>
</td>
  </tr>
</table>

Est ce quelqu'un pourrait me dire comment je peux faire pour que cela fonctionne aussi sous IE.
Merci d'avance!
Modifié par Babou (04 Oct 2005 - 17:58)

Bonjour Babou et bienvenue ici,

Attention à ton lien qui n'est pas affiché correctement. L'aide du forum et la FAQ vont t'aider sur ce point

Merci Raphael !

Ok je regarde ça!

Je suis en train de regarder mais je ne trouve pas ,en fait cest super urgent , si quelqu'un connait la solution, STP dites le moi...