Menu javascript et padding, pb IE6 [résolu]

NB : probleme résolu, voir le forum général.

Bonjour,

J'ai un souci avec IE6 pour mon menu :

Javascript :

<script type="text/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>

HTML :

<div id="menu">
	<dl>			
		<dt onMouseOver="javascript:montre('smenu1');">test menu </dt>
			<dd id="smenu1" onMouseOver="javascript:montre('smenu1');" onMouseOut="javascript:montre('');">
				<ul>
					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Philosophie</a></li>
					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Localisation</a></li>
					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> L'équipe</a></li>
					<li><a href="#"><img src="images/pucenoir.gif" alt="puce" /> Historique</a></li>
				</ul>

			</dd>
	</dl>	
</div>

Et le CSS :

* { margin:0; padding:0; }

body {
background: white;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
text-align:center;
}
dl, dt, dd, li {
margin: 0;
padding: 0;
list-style-type: none;
}
ul{
list-style-image:none;
}
#menu {
position: absolute;
top: 178px;
left: 80px;
z-index:100;
width: 176px;
font-size:87%;
}
#menu dl {
float: left;
width: 11em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: left;
font-weight: bold;
}
#menu li {
text-align: left;
font-weight: bold;
/*padding: 4px;*/
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}

Mon problème, c'est que j'aimerais mettre mon padding :4px dans #menu li, mais que si je le fais, IE6 plante le menu (on ne peut plus cliquer sur la liste déroulante, comme si le onmouseout ne fonctionnait plus comme il faut avec ce padding).
Comment je peux régler ce problème ?
Merci d'avance !
Modifié par maryline (10 Jan 2007 - 14:27)