Bonjour,
J'ai récupéré un menu vertical pas trop mal fait sur ce site :
http://www.cssplay.co.uk/menus/flyoutt.html
Je l'ai arrangé pour que les sous-menus s'ouvrent par la gauche (puisque mon menu est à droite).
Le menu marche nikel sous Opera, Safari, Firefox mais bien sur pas du tout sous IE7 (comme d'hab').
Mais ce qu'il y a d'étrange c'est que le menu marche sous tous les navigateurs avec cette page d'essai là :
http://www.monsite.com/menu.html
Mais ne marche pas avec IE7 (ça fait juste des liens) si je l'intègre à mon site là :
http://www.monsite.com/index2.php
Bref, il y a sûrement un élément de ma page qui fait buguer le menu sur IE7 mais je ne vois pas.
Voici le code CSS (disponible sur le premier lien) :
Merci de m'éclairer de vos bougies !
lofo7
Modifié par lofo7 (15 Jan 2008 - 14:40)
J'ai récupéré un menu vertical pas trop mal fait sur ce site :
http://www.cssplay.co.uk/menus/flyoutt.html
Je l'ai arrangé pour que les sous-menus s'ouvrent par la gauche (puisque mon menu est à droite).
Le menu marche nikel sous Opera, Safari, Firefox mais bien sur pas du tout sous IE7 (comme d'hab').
Mais ce qu'il y a d'étrange c'est que le menu marche sous tous les navigateurs avec cette page d'essai là :
http://www.monsite.com/menu.html
Mais ne marche pas avec IE7 (ça fait juste des liens) si je l'intègre à mon site là :
http://www.monsite.com/index2.php
Bref, il y a sûrement un élément de ma page qui fait buguer le menu sur IE7 mais je ne vois pas.
Voici le code CSS (disponible sur le premier lien) :
/* Style commun à tous les navigateurs */
.menu {font-family: arial, sans-serif; /* WIDTH/HEIGHT:taille du DIV. */
width:180px;
height:150px;
position:relative;
margin:0;
font-size:14px;
margin:0 0 50px 0;
padding-left:14px
}
.menu ul li a, .menu ul li a:visited {/* Couleur premier menu NON survolé et de la police - WIDTH/HEIGHT:taille des blocs dans le DIV - LINE-HEIGHT: centre verticalement le texte*/
display:block;
text-decoration:none;
color:#000;
width:180px;
height:20px;
text-align:center;
border:none;
background:#FFF;
line-height:19px;
font-size:14px;
}
.menu ul {padding:0;
margin:0;
list-style-type: none;
}
.menu ul li {margin-right:1px;
position:relative;
}
.menu ul li ul {display: none;
}
/* Style spécifique à IE */
.menu ul li:hover a {/* Couleur premier menu survolé */
color:#FFF; background:#000;
}
.menu ul li:hover ul {
display:block;
position:absolute;
top:0;
right:180px;
width:178px;
}
.menu ul li:hover ul li a.hide {
background:#dfc184;
color:#000;
}
.menu ul li:hover ul li:hover a.hide {
width:180px;
}
.menu ul li:hover ul li ul {
display: none;
}
.menu ul li:hover ul li a {/* Couleur deuxième menu NON survolé */
display:block;
background:#b3ab79;
color:#000;
width:180px;
}
.menu ul li:hover ul li a:hover {/* Couleur deuxième menu survolé */
background:#dfc184;
color:#000;
}
.menu ul li:hover ul li:hover ul {
display:block;
position:absolute;
right:198px;
top:0;
color:#000;
}
.menu ul li:hover ul li:hover ul li a {/* Couleur troisième menu NON survolé */
display:block;
width:200px;
background:#dfc184;
color:#000;
}
.menu ul li:hover ul li:hover ul li a:hover {/* Couleur troisième menu survolé */
background:#bd8d5e;
color:#fff;
}
Merci de m'éclairer de vos bougies !
lofo7
Modifié par lofo7 (15 Jan 2008 - 14:40)