Bug Menu déroulant sous IE7
kyuub
-
kyuub -
kyuub -
Bonjour,
Pour commencer je vous donne le lien du site en question : http://www.selni.fr
Alors voilà, le problème vient de mon menu déroulant. Il est fait exclusivement de html et css. Sous IE7, lorsque je passe ma souris sur l'onglet produit une premiere fois, tout est normal, mais si jamais je sors de cette onglet par un coté ou par le bas, si je repasse la souris dessus, le navigateur affiche l'arriere plan des sous-sous-menus.
C'est quelquechose de deroutant lorsque tous les autres navigateurs l'affichent très bien.
Je vous donne le code css et html correspondant:
Code CSS:
/*partie pour le menu déroulant*/
#menu ul
{
margin:0;
padding:0;
list-style-type: none;
text-align: center;
}
#menu li
{
float:left;
padding:0;
background-image: url(image/menu/menugristest2.jpg);
}
#menu ul li
{
position:relative;
list-style:none;
border-top:1px solid;
border-bottom:1px solid;
}
#menu ul ul
{
position: absolute;
display: none;
width: 100px;
}
#menu ul li:hover ul
{
display:block;
}
#menu li a
{
display: block;
color:black;
text-decoration: none;
padding: 5px;
width:90px;
}
#menu li a:hover
{
background-color: #D0D0D0;
}
#menu ul li ul li ul
{
top:15px;
left:100px;
}
#menu li ul
{
position:absolute;
}
/* affichage du sous-sous menu*/
#menu ul ul ul li
{
display:none;
}
#menu ul ul li:hover ul li
{
display:block;
}
#menu ul ul li
{
background-image: url(image/menu/menugristest.jpg);
}
#menu ul ul li a:hover
{
background-color: #D0D0D0;
}
Code HTML:
<div id="menu">
<ul>
<li>
<a href="<?php echo $Accueil; ?>" class="<?php echo $select1; ?>">Accueil</a>
</li>
<li><a href="<?php echo $entreprise; ?>" class="<?php echo $selectE; ?>">Entreprise</a>
<ul>
<li><a href="<?php echo $histoire; ?>" class="<?php echo $select3; ?>">Histoire</a></li>
<li><a href="<?php echo $valeur; ?>" class="<?php echo $select4; ?>">Valeurs</a></li>
<li><a href="<?php echo $qualite; ?>" class="<?php echo $select5; ?>">Qualité</a></li>
<li><a href="<?php echo $logistique; ?>" class="<?php echo $select6; ?>">Logistique</a></li>
<li><a href="<?php echo $localisation; ?>" class="<?php echo $select7; ?>">Localisation</a></li>
</ul>
</li>
<li><a href="<?php echo $produits; ?>" class="<?php echo $select8; ?>">Produits</a>
<ul>
<li><a href="<?php echo $moteuruni; ?>" class="<?php echo $select9; ?>">Moteurs universels</a>
<ul>
<li><a href="<?php echo $spe_tech_moteuruni; ?>" class="<?php echo $select10; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_moteuruni; ?>" class="<?php echo $select11; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_moteuruni; ?>" class="<?php echo $select12; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_moteuruni; ?>" class="<?php echo $select13; ?>">Applications</a></li>
</ul>
</li>
<li><a href="<?php echo $moteurahv; ?>" class="<?php echo $select14; ?>">Moteurs AHV/CIM</a>
<ul>
<li><a href="<?php echo $spe_tech_moteurahv; ?>" class="<?php echo $select15; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_moteurahv; ?>" class="<?php echo $select16; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_moteurahv; ?>" class="<?php echo $select17; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_moteurahv; ?>" class="<?php echo $select18; ?>">Applications</a></li>
</ul>
</li>
<li><a href="<?php echo $pompe; ?>" class="<?php echo $select19; ?>">Pompes</a>
<ul>
<li><a href="<?php echo $spe_tech_pompe; ?>" class="<?php echo $select20; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_pompe; ?>" class="<?php echo $select21; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_pompe; ?>" class="<?php echo $select22; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_pompe; ?>" class="<?php echo $select23; ?>">Applications</a></li>
</ul>
</li>
</ul>
<li><a href="<?php echo $moyen; ?>" class="<?php echo $select24; ?>">Moyens</a>
<ul>
<li><a href="<?php echo $recherche; ?>" class="<?php echo $select25; ?>">R & D</a></li>
<li><a href="<?php echo $equipement; ?>" class="<?php echo $select26; ?>">Equipements</a></li>
</ul>
</li>
<li><a href="<?php echo $job; ?>" class="<?php echo $select27; ?>">Métiers</a>
<ul>
<li><a href="<?php echo $opportunite; ?>" class="<?php echo $select28; ?>">Opportunités</a></li>
<li><a href="<?php echo $CV; ?>" class="<?php echo $select29; ?>">CV</a></li>
</ul>
</li>
<li><a href="<?php echo $contact; ?>" class="<?php echo $select30; ?>">Contacts</a></li>
<li><a href="<?php echo $login; ?>" class="<?php echo $select31; ?>">Login</a></li>
</ul>
</div>
Pour commencer je vous donne le lien du site en question : http://www.selni.fr
Alors voilà, le problème vient de mon menu déroulant. Il est fait exclusivement de html et css. Sous IE7, lorsque je passe ma souris sur l'onglet produit une premiere fois, tout est normal, mais si jamais je sors de cette onglet par un coté ou par le bas, si je repasse la souris dessus, le navigateur affiche l'arriere plan des sous-sous-menus.
C'est quelquechose de deroutant lorsque tous les autres navigateurs l'affichent très bien.
Je vous donne le code css et html correspondant:
Code CSS:
/*partie pour le menu déroulant*/
#menu ul
{
margin:0;
padding:0;
list-style-type: none;
text-align: center;
}
#menu li
{
float:left;
padding:0;
background-image: url(image/menu/menugristest2.jpg);
}
#menu ul li
{
position:relative;
list-style:none;
border-top:1px solid;
border-bottom:1px solid;
}
#menu ul ul
{
position: absolute;
display: none;
width: 100px;
}
#menu ul li:hover ul
{
display:block;
}
#menu li a
{
display: block;
color:black;
text-decoration: none;
padding: 5px;
width:90px;
}
#menu li a:hover
{
background-color: #D0D0D0;
}
#menu ul li ul li ul
{
top:15px;
left:100px;
}
#menu li ul
{
position:absolute;
}
/* affichage du sous-sous menu*/
#menu ul ul ul li
{
display:none;
}
#menu ul ul li:hover ul li
{
display:block;
}
#menu ul ul li
{
background-image: url(image/menu/menugristest.jpg);
}
#menu ul ul li a:hover
{
background-color: #D0D0D0;
}
Code HTML:
<div id="menu">
<ul>
<li>
<a href="<?php echo $Accueil; ?>" class="<?php echo $select1; ?>">Accueil</a>
</li>
<li><a href="<?php echo $entreprise; ?>" class="<?php echo $selectE; ?>">Entreprise</a>
<ul>
<li><a href="<?php echo $histoire; ?>" class="<?php echo $select3; ?>">Histoire</a></li>
<li><a href="<?php echo $valeur; ?>" class="<?php echo $select4; ?>">Valeurs</a></li>
<li><a href="<?php echo $qualite; ?>" class="<?php echo $select5; ?>">Qualité</a></li>
<li><a href="<?php echo $logistique; ?>" class="<?php echo $select6; ?>">Logistique</a></li>
<li><a href="<?php echo $localisation; ?>" class="<?php echo $select7; ?>">Localisation</a></li>
</ul>
</li>
<li><a href="<?php echo $produits; ?>" class="<?php echo $select8; ?>">Produits</a>
<ul>
<li><a href="<?php echo $moteuruni; ?>" class="<?php echo $select9; ?>">Moteurs universels</a>
<ul>
<li><a href="<?php echo $spe_tech_moteuruni; ?>" class="<?php echo $select10; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_moteuruni; ?>" class="<?php echo $select11; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_moteuruni; ?>" class="<?php echo $select12; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_moteuruni; ?>" class="<?php echo $select13; ?>">Applications</a></li>
</ul>
</li>
<li><a href="<?php echo $moteurahv; ?>" class="<?php echo $select14; ?>">Moteurs AHV/CIM</a>
<ul>
<li><a href="<?php echo $spe_tech_moteurahv; ?>" class="<?php echo $select15; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_moteurahv; ?>" class="<?php echo $select16; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_moteurahv; ?>" class="<?php echo $select17; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_moteurahv; ?>" class="<?php echo $select18; ?>">Applications</a></li>
</ul>
</li>
<li><a href="<?php echo $pompe; ?>" class="<?php echo $select19; ?>">Pompes</a>
<ul>
<li><a href="<?php echo $spe_tech_pompe; ?>" class="<?php echo $select20; ?>">Spécifications techniques</a></li>
<li><a href="<?php echo $spe_dim_pompe; ?>" class="<?php echo $select21; ?>">Spécifications dimensionnelles</a></li>
<li><a href="<?php echo $carac_elec_pompe; ?>" class="<?php echo $select22; ?>">Caractéristiques électriques</a></li>
<li><a href="<?php echo $appli_pompe; ?>" class="<?php echo $select23; ?>">Applications</a></li>
</ul>
</li>
</ul>
<li><a href="<?php echo $moyen; ?>" class="<?php echo $select24; ?>">Moyens</a>
<ul>
<li><a href="<?php echo $recherche; ?>" class="<?php echo $select25; ?>">R & D</a></li>
<li><a href="<?php echo $equipement; ?>" class="<?php echo $select26; ?>">Equipements</a></li>
</ul>
</li>
<li><a href="<?php echo $job; ?>" class="<?php echo $select27; ?>">Métiers</a>
<ul>
<li><a href="<?php echo $opportunite; ?>" class="<?php echo $select28; ?>">Opportunités</a></li>
<li><a href="<?php echo $CV; ?>" class="<?php echo $select29; ?>">CV</a></li>
</ul>
</li>
<li><a href="<?php echo $contact; ?>" class="<?php echo $select30; ?>">Contacts</a></li>
<li><a href="<?php echo $login; ?>" class="<?php echo $select31; ?>">Login</a></li>
</ul>
</div>
A voir également:
- Bug Menu déroulant sous IE7
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique
- Bug chromecast - Guide
- Supprimer menu déroulant excel - Forum Réseaux sociaux