Problème d'affichage d'un menu css sous IE6 et IE7

Bonjour à tous.

Je conçois un site pour le CE de mon entreprise et c'est mon tout premier site.
J'ai doit réaliser un menu déroulant.
Il fonctionne parfaitement sous firefox, mais
sous IE7 il s'affiche que partiellement. Quant à IE6,
c'est simple : les sous menus ne s'affichent pas.

Voici ma css :

Citation:

#menu1 {

width:120px;

}

li.menu2
{

background-color:#FB2038;
}

li.menu3
{

background-color:#fc9300;

}

ul, li
{
display:block;
margin:0;
padding:0;
border:0px none;
}

ul
{
width:140px; /*modif largeur cadre*/
list-style:none;
}

li
{
position:relative;
padding:1px;
padding-left:10px; /*modif position texte largeur */
z-index:9;
}

li.menu1>ul
{
position:absolute;
left:120px; /* IE */
top:5px;
}

li.menu2>ul
{
position:absolute;
left:120px;
top:-25px;
}

li.menu3>ul
{
position:absolute;
left:120px;
top:-25px;
}

/* others */

li.menu1 a
{
padding:2px;
text-decoration:none;
color:white;
font-weight:bold;
/*width:100%; /* IE */
display:block;
margin:0;
border:0px none;

}

li>a
{
width:auto;
} /* others */

/* regular hovers */

a.menu1:hover
{
font-weight:bold;
color:#FC9300;
}

a.menu2:hover
{
font-weight:bold;
color:#4ecef7;

}

a.menu3:hover
{
font-weight:bold;
color:#fb2038;
}

/* hovers with specificity */

li.menu1:hover, li.menu2:hover
{
font-weight:bold;
color:#FC9300;
z-index:100;
}

li.menu2:hover
{
font-weight:bold;
color:#4ecef7;
z-index:100;
}

li.menu3:hover
{
font-weight:bold;
color:#fb2038;
z-index:100;
}

ul ul, li:hover ul ul
{
display:none;
}

li:hover ul, li:hover li:hover ul
{
display:block;
}

Sauriez vous d' où peut venir le problème?
Je vous remercie d'avance ;)

J'ai eu des soucis du même type il y a peu de temps :

J'ai trouvé les raisons du non affichage de mes menus déroulants :

Le margin-top ou le padding-top étaient trop importants et créaient un espace vide entre le bouton et le sous-menu, donc au survol de la zone vide, ça ne s'affichait pas.
Essaie donc de mettre des margin-top à 0, voir négatifs, si ça provient de là.

Il est aussi possible que ton sous-menu passe "sous" un <div>, et qu'il soit masqué, donc

Code:

z-index:1;

pour Firefox, pour IE, il faut trouver une solution pour que ca ne se chevauche pas...

Merci beaucoup pour ta réponse razorlok :)
Je vais essayer tes conseils ^^

Est-ce qu'il est possible d'avoir le code html stp?

Je suis plutôt d'accord avec razorlock, généralement les paddings ça merde un peu sous IE. Je crois que ça viens du faite que les valeurs n'ont pas le même 0 (il y en a un qui compte la bordure dans la marge interne et l'autre non je crois)

Personnellement j'essaie toujours d'éviter les paddings

Alors voici mon code. En fait le contenu de mon menu est chargé d'une BDD

Citation:

<ul>
<?php
$requete = "SELECT num_elus, nom_elus FROM elus";
$resultat = mysql_query($requete);
while($enreg = mysql_fetch_array($resultat))
{
$num_elus = $enreg["num_elus"];
$nom = $enreg["nom_elus"];
echo '<li class="menu2"><a href = "elus1.php?num_elus='.$num_elus.'" class="menu2">Elus '. $nom .'</a></li>';
}
?>
</ul>
</li>
<li class="menu1"><a href="commission.php" class="menu1">Commissions</a>
<ul>
<?php
$requete = "SELECT * FROM commission";
$resultat = mysql_query($requete);
while($enreg = mysql_fetch_array($resultat))
{
$num_comm = $enreg["num_comm"];
$nom = $enreg["nom_comm"];
$fic = $enreg["fic_comm"];

$sql = "SELECT nom_sscomm,num_sscomm FROM sscomm WHERE num_comm = $num_comm";
$result = mysql_query($sql);
$rows = mysql_num_rows($result);
if ($rows == 0)
{
if ((!is_null($fic)) || ($fic!="comm/"))
{
echo '<li class="menu2"><a href = '.$fic.' target=\"_blank\" class="menu2">'.$nom.'</a></li>';
}
else
{
echo '<li class="menu2"><a href = "#" target=\"_blank\" class="menu2">'.$nom.'</a></li>';
}
}
else
{
echo '<li class="menu2"><a href = "sscommission.php?num_comm='.$num_comm.'" class="menu2">'.$nom.'</a>';
echo '<ul>';
$req = "SELECT nom_sscomm,num_sscomm FROM sscomm WHERE num_comm = $num_comm";
$res = mysql_query($req);
$rows = mysql_num_rows($res);
while ($enreg = mysql_fetch_array($res))
{
$num_sscomm = $enreg["num_sscomm"];
$nom_sscomm = $enreg["nom_sscomm"];
echo '<li class="menu3"><a href="sscommission1.php?num_comm='.$num_comm.'&num_sscomm='.$num_sscomm.'" class="menu3">'.$nom_sscomm.' ('.$num_sscomm.')</li>';
}
echo '</ul>';
echo '</li>';
}
}
?>
</ul>
</li>
<li class="menu1"><a href="aclts.php" class="menu1">ACLTS</a>
<ul>
<?php
$requete = "SELECT * FROM type_ACLTS";
$resultat = mysql_query($requete);
while($enreg = mysql_fetch_array($resultat))
{
$num_type = $enreg["num_type"];
$nom_type = $enreg["nom_type"];
echo '<li class="menu2"><a href="aclts1.php?num_type='.$num_type.'" class="menu2">'.$nom_type.'</a></li>';
}
?>
</ul>
</li>
<li class="menu1"><a href="news.php" class="menu1">News</a></li>
<li class="menu1"><a href="down.php" class="menu1">Téléchargement</a></li>
<li class="menu1"><a href="offre.php" class="menu1">Offres CE</a></li>
<li class="menu1"><a href="pann.php" class="menu1">Petites Annonces</a></li>
<li class="menu1"><a href="contact.php" class="menu1">Contact</a></li>
</ul>

Il y a peut-être un div de texte en dessous de ton menu, qui bloque son affichage.
Est-ce un menu vertical ou horizontal ? Où est-il situé dans le squelette de ton site ?

J'ai changer le margin-top et le padding-top comme vous me l'avez conseillé, mais toujours pas d'affichage...
De plus si je change le padding-top, le menu est mal position par rapport au site.
J'ai mis temporairement le site à l'adresse suivante :
http://tomtom716.free.fr/CE

J'ai essayé ton lien, sous Mozilla, ton menu marche très bien.
Sous IE je ne peux pas te dire l'accès internet est bloqué au bureau (tant mieux :roll:).

C'est un menu vertical, donc change les valeurs de margin-left et padding-left, négativement si il faut.

Citation:

Envoyé par razorlok

Il y a peut-être un div de texte en dessous de ton menu, qui bloque son affichage.
Est-ce un menu vertical ou horizontal ? Où est-il situé dans le squelette de ton site ?

Il y a effectivement un div de texte en dessous de mon menu. (j'ai utiliser pour ça la propriété clear:both)
Je suis obligé de passer par ça si je veux que mon menu s'affiche sans être coupé sous IE (problème que j'ai eu il y a quelque temps)
Il s'agit d'un menu vertical.

J'ai oublié de préciser, vu que tu patch essentiellement pour IE, n'oublie pas de mettre un / avant tes valeurs.

Code:

/margin-left:-5px;