menu deroulant fonctionnant sous ie6 mais pas sous ie8

tribalwar · 6 Juillet 2010

bonjour,
Je viens de m'apercevoir que mon menu déroulant qui fonctionne sous ie6 refuse de fonctionner sous ie8. Prends-en donc un autre me direz-vous... oui mais il faudrait revoir toute la structure du site alors qu'il ne s'agit peut-etre que d'un petit détail. Bref, je vous soumets le code et la css.

<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<div class="mainmenu">
<ul>
<li class="li_nc"><a href="#" target="_self" >Accueil</a></li>
<li class="li_hc">
<div align="left"><a href="#" target="_self" >menu</a>
<ul class="ul_ch">
<li class="li_nc"><a href="#" target="_self" >sousmenu 1</a></li>
<li class="li_nc"><a href="#" target="_self" >sousmenu 2</a></li>
<li class="li_nc"><a href="#" target="_self" >sousmenu 3</a></li>
</ul>
</div>
</ul>
</div>
</body>
</html>

@charset "utf-8";
/* CSS Document */

body {
background-color: #CCCCCC;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;

/* for pull-down menu to work in IE6*/
behavior:url("csshover2.htc");

}

/* pull-down mainmenu css */
.mainmenu1{
float: left;
width: 100%;
padding: 0;
}
.mainmenu ul {
float: left;
width: 100%;
list-style: none;
line-height:0;
color:#FFFFCC;
background: #67841A;
padding: 0;
border: solid #666666;
border-width: 1px 0;
margin: 0 0 1em 0;
}

.mainmenu a, .mainmenu a:visited {
display: block;
font-family:trebuchet MS;font-size:12px;font-weight:bold;font-style:normal;text-decoration:underline;
color: #FFFFCC;
text-decoration: none;
padding: 1em 1em;
}
.mainmenu ul ul a{
width:100%;
height:100%;
}
.mainmenu ul a{
width:1%;
}

.mainmenu li {
float: left;
margin:0;
padding:0;
}

.mainmenu ul li {float:left; position:relative; }
.mainmenu ul li a {white-space:nowrap;}

.mainmenu li ul {
position: absolute;
left: -999em;
height: auto;
width:8em;

background: #67841A;
font-weight: normal;
border-width: 1px;
margin: 0;
}

.mainmenu li li {
width:8em ;
}

.mainmenu li li a{
width:8em ;
}

.mainmenu li ul {
margin: 0;
}
.mainmenu li ul ul {
margin: -2.8em 0 0 13.5em;
}
.ul_ch,
.mainmenu li:hover ul ul,
.mainmenu li li:hover ul ul,
.mainmenu li li li:hover ul ul,
.mainmenu li li li li:hover ul ul,
.mainmenu li li li li li:hover ul ul
{
left: -999em;
}
.mainmenu li:hover ul,
.mainmenu li li:hover ul,
.mainmenu li li li:hover ul,
.mainmenu li li li li:hover ul,
.mainmenu li li li li li:hover ul
{
left: auto;
}
.mainmenu li:hover>ul.ul_ch
{
left: auto;
}

.mainmenu li:hover{
background: #77991E;
}

.mainmenu li:hover a,.mainmenu li:hover a:visited,.mainmenu li:hover a:hover,.mainmenu li a:hover{
color:#CC3300;
}
.mainmenu li:hover li a, .mainmenu li li:hover li a,
.mainmenu li li li:hover li a, .mainmenu li li li li:hover li a,
.mainmenu li:hover li a:visited, .mainmenu li li:hover li a:visited,
.mainmenu li li li:hover li a:visited, .mainmenu li li li li:hover li a:visited
{
color:#FFFFCC;
}
.mainmenu li li:hover, .mainmenu li li li:hover,
.mainmenu li li li li:hover , .mainmenu li li li li li:hover , .mainmenu li li li li li li:hover
{
background: #77991E;
z-index:9999;
}
.mainmenu li li:hover a,.mainmenu li li li:hover a,
.mainmenu li li li li:hover a, .mainmenu li li li li li:hover a
{
color: #FFFFCC;
}

.mainmenu ul ul a, .mainmenu ul ul a:visited,
.mainmenu li li a, .mainmenu li li a:visited
{
color: #FFFFCC;
}
.mainmenu ul ul a:hover,
.mainmenu li:hover li:hover a,.mainmenu li:hover li:hover a:visited ,
.mainmenu li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover a:visited,
.mainmenu li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover a:visited ,
.mainmenu li:hover li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover li:hover a:visited,
.mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a,.mainmenu li:hover li:hover li:hover li:hover li:hover li:hover a:visited{
color: #FFFFCC;
}
.mainmenu li:hover li:hover li a,.mainmenu li:hover li:hover li a:visited ,
.mainmenu li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li a:visited,
.mainmenu li:hover li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li:hover li a:visited,
.mainmenu li:hover li:hover li:hover li:hover li:hover li a,.mainmenu li:hover li:hover li:hover li:hover li:hover li a:visited{
color: #FFFFCC;
}

/* end of mainmenu css */

Dr DLP · 6 Juillet 2010

Peux tu donner un lien et/ou décrire le problème?

tribalwar · 6 Juillet 2010

RESOLU: j'avais oublié
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
Merci

Leonick · 6 Juillet 2010

et pour ie7 et ie8, plus besoin d'avoir le hack, ça fonctionne directement en css