J'ai un problème épineux a vous soumettre, un bug d'affichage avec IE6.
J'explique en deux mots : un menu en cascade de deux sous menu, lors du survol d'un lien dans le premeier sous menu, un second s'ouvre.
Cela fonctionne très bien et s'affiche clairement dans IE7 et Firefox, seulement dans IE6 je me retrouve avec un espace sous le lien vers le sous-sous menu et je n'arrive vraiment pas a m'en débarasser. Je joint mon code pour ceux qui voudraient s'amuser de ce casse tête chinois :
menu.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<!--Gestion du menu haut-->
<script type="text/javascript" src="menu.js"></script>
<link href="menu.css" rel="stylesheet" type="text/css" />
</head>
[# Menu]
<li>[# Sous menu 4.1 ]</li><li>[# Sous menu 4.2 ]
<!-- sous sous menu 3 -->
<li>[# Sous menu 4.2.1 ]</li><li>[# Sous menu 4.2.2 ]</li><li>[# Sous menu 4.2.3 ]</li><li>[# Sous menu 4.2.4 ]</li>
</li>
</html>
menu.js
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=7; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
function show(id) {
var d = document.getElementById(id);
for (var i = 1; i<=7; i++) {
if (document.getElementById('ssmenu'+i)) {document.getElementById('ssmenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
et enfin la feuille de style, menu.css
#navigationprincipale, #navigationprincipale li {
margin:0;
padding:0;
list-style:none;
}
tout d'abord un grand merci pour ton aide, je vois que sur ce forum on peut compter sur l'attention des membres.
La solution que tu proposes aligne les deux blocs menu, mais mon problème n'est pas la, je me suis mal expliqué.
Dans le premier bloc menu, le lien sous menu 4.2 qui ouvre le second bloc a un background bleu au survol. Et je me retrouve avec un espace d'environ 3 pixels sous ce background. J'ai tenté de contraindre le bloc de plusieurs manière (hauteur en pixel, margin-bottom à 0...) et rien n'y fait, ce leger espace ne veut pas disparaitre sur IE.
Le problème ne survient que sur les liens vers les sous menu, je pense a un bug d'affichage spécifique a internet explorer car sur firefox il n'y a aucun soucis...
Oui, c'est leur exemple de menu déroulant horizontal qui est a l'origine de mon menu en cascade. Je pense effectivement que cela peut se résoudre au niveau du css mais pour l'instant je sèche. J'ai posé la même question sur leur forum mais pas encore de réponse. En tous cas merci de ton aide ;o)
Bon, j'ai trouvé seul la solution après des heures d'arrachage de cheveux
Evidemment cela parait simple et évident une fois que l'on a trouvé
Il fallait tout simplement fermer la liste du premier sous-menu </li> avant d'ouvrir la
du sous-sous menu ;o)
C'est vrai nickadele, mais c'est a rien n'y comprendre car le bug persiste avec la source que tu m'as donné, je l'avais bien sur testée (essaye tu verras, il y a encore ce fameux espace sous le lien). Pourtant tu as raison, elle contenait la solution. Je vais éplucher cela et te dire ou se trouve la différence ;o)
