Bonjour, j'aurais besoin d'un petit coup de main pour réparer un problème que j'ai sous IE avec un menu disponible dans la Galerie de menus de l'excellent Alsacréations. Ce menu.
Code HTML
<div id="horizontal"><div id="horizontal2"><dl><dt onmouseover="java script:montre();"><a href="../"><img src="../images/accueil.gif" alt="Accueil" /></a></dt></dl> <dl><dt onmouseover="java script:montre();"><a href="http://www.gtanf.com/forums/"><img src="../images/forums.gif" alt="Forums" /></a></dt></dl> <dl><dt onmouseover="java script:montre('smenu1');"><img src="../images/lejeu.gif" alt="Le Jeu" /></dt> <dd id="smenu1"> <ul><li><a href="../?page=cartes">Cartes</a></li> <li><a href="?page=fiche">Fiche</a></li> <li><a href="galerie/">Galerie d'images</a></li> <li><a href="../?page=gangs">Gangs</a></li> <li><a href="../?page=mysteres">Mystères</a></li> <li><a href="../?page=personnages">Personnages</a></li> <li><a href="../?page=radios">Radios</a></li> <li><a href="../?page=ville">Villes</a></li></ul></dd></dl> <dl><dt onmouseover="java script:montre('smenu2');"><img src="../images/aides.gif" alt="Aides" /></dt> <dd id="smenu2"> <ul><li><a href="../?page=astuces">Astuces</a></li> <li><a href="../?page=codes">Codes</a></li> <li><a href="../?page=jobs">Jobs</a></li> <li><a href="../?page=missions">Missions</a></li> <li><a href="../?page=missions_annexes">Missions annexes</a></li> <li><a href="../?page=rodeos">Rodéos</a></li> <li><a href="../?page=sauts">Sauts</a></li> <li><a href="../?page=tutoriaux">Tutoriaux</a></li></ul></dd></dl> <dl><dt onmouseover="java script:montre('smenu3');"><img src="../images/partenaires.gif" alt="Partenaires" /></dt> <dd id="smenu3"> <ul><li><a href="http://www.gtabig.com/" onclick="window.open(this.href); return false;">GTABig.com</a></li> <li><a href="http://www.gtafight.com/" onclick="window.open(this.href); return false;">GTAFight.com</a></li> <li><a href="http://www.gtaplay.com" onclick="window.open(this.href); return false;">GTAPlay.com</a></li></ul></dd></dl></div></div>
Code CSS
#horizontal{width: 800px; height: 50px; float: right; background-image: url("images/pub.gif");} #horizontal2{position: relative; float: left; top: 6px; left: 30px; z-index: 1;} #horizontal dl{float: left; width: 148px; margin: 0;} #horizontal dt{cursor: pointer; text-align: center; margin: 0;} #horizontal dd{display: none; border: 1px solid #FFBB00; width: 148px; margin: 0;} #horizontal ul{margin: 0; padding: 0; list-style-type: none;} #horizontal li{text-align: center; background: #000000;} #horizontal li a, #horizontal dt a{color: #FFFFFF; text-decoration: none; display: block; height: 100%; border: none;} #horizontal li a:hover, #horizontal dt a:hover {background: #EEEEEE; color: #000000;}
Je pense que ce problème est principalement dû à un z-index mais après une multitude de tentative je n'ai pas pu le régler, j'ai donc laisser le z-index: 100; et enlevé les autres.
Vous pouvez voir le problème ici même.
Mes salutations.
