Je sais, désolé, encore un problème de menu sous IE... Là je trouve ça assez original.
En fait, le contenu disparait à gauche et à droite des sous menus... Voilà des exemples :
Forcément, sous Firefox, c'est impeccable : ICI
Mais sous IE : ICI
Donc voilà, c'est relativement embêtant :s je vous poste ici les parties du code que je trouve intéressantes :
Donc le CSS du menu, repris du tutorial :
A noter que les z-index sont mis au petit bonheur la chance, car je n'ai vu aucun changement avec ou sans, et où qu'ils soient placés.
Le #main et le cadre principal, le #contenu est le cadre qui contient le contenu (sans blague
), et par-dessus duquel passe le menu...
Sinon le HTML, rien de spécial, c'est de la forme :
Voilà voilà... Si quelqu'un peut m'aider, je le remercie d'avances
En fait, le contenu disparait à gauche et à droite des sous menus... Voilà des exemples :
Forcément, sous Firefox, c'est impeccable : ICI
Mais sous IE : ICI
Donc voilà, c'est relativement embêtant :s je vous poste ici les parties du code que je trouve intéressantes :
Donc le CSS du menu, repris du tutorial :
/* Définition du style du menu */
#menu {
z-index:100;
position : absolute;
top : 180px;
margin:0px;
padding:0px;
background-color:#FDCB24;
height:20px;
width:798px;
}
#menu dl,#menu dt,#menu dd,#menu ul,#menu li {
margin: 0;
padding: 0;
list-style-type: none;
z-index:100;
}
#menu dl {
float: left;
margin: 0px;
width : 200px;
}
#menu dt {
height : 20px;
cursor: pointer;
text-align: center;
font-weight: bold;
background: #FDCB24;
border: 0px solid gray;
width : 200px;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
text-decoration: none;
}
#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;
}A noter que les z-index sont mis au petit bonheur la chance, car je n'ai vu aucun changement avec ou sans, et où qu'ils soient placés.
#main {
margin: 0px auto;
margin-top: 10px;
width: 800px;
background-color: white;
border: 1px solid black;
}
#contenu {
z-index:1;
padding:30px;
background-color:#FDCB24;
}Le #main et le cadre principal, le #contenu est le cadre qui contient le contenu (sans blague
), et par-dessus duquel passe le menu...Sinon le HTML, rien de spécial, c'est de la forme :
<!-- Ici on fait apparaitre le menu -->
<div id="menu">
<dl>
<dt onmouseover="javascript:montre('smenu1');"><a href="">Formations</a></dt>
<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">
<ul>
<li><a href="index.php?page=calendrier">Calendrier</a></li>
<li><a href="index.php?page=lister_formations">Liste des formations</a></li>
</ul>
</dd>
</dl>
...
</div>Voilà voilà... Si quelqu'un peut m'aider, je le remercie d'avances