Ypineault
Ypineault

Reputation: 11

CSS menu won't work with internet explorer 11

I found this CSS code for an horizontal dropdown menu over the internet which at first seems really good (the results on chrome are perfect). However, when I try it with internet explorer, white spaces appear between the dropdown elements and I cannot navigate the menu.

Have any idea? Your help would be greatly appreciated.

HTML :

<div id="menu">

<ul>
    <li><a href="accueil.htm">Accueil</a></li>
    <li><a href="cv/Cvfrdept.pdf">CV</a></li>
    <li><a href="accueil.htm">Enseignement</a>
    <ul>
                    <li><a href="plans.htm">Plans de cours</a></li>
                    <li><a href="lecons.htm">Leçons</a></li>
                    <li><a href="ppt.htm">Powerpoints </a></li>
    </ul>
    </li>
    <li><a href="recherche.htm">Recherche</a>
    <ul>
                    <li><a href="italia.htm">Italia</a></li>
                    <li><a href="livres.htm">Livres</a></li>
    </ul>
    </li>
    <li><a href="liens.htm">Liens</a></li>
    <li><a href="contact.htm">Contact</a></li>
    <li><a href="home.htm">English</a></li>
 </ul>

 </div>

And the CSS :

ul {
   font-family: Arial, Verdana;
   font-size: 14px;
   margin: 0;
   padding: 0;
   list-style: none;
}

ul a:hover {
    color: #ffffff;         
}

ul li {
  display: block;
  position: relative;
  float: left;
}

li ul { 
   display: none; 
}

ul li a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  border-top: 0px solid #ffffff;
  padding: 5px 15px 5px 15px;
  background: #2C5463;
  margin-left: 0px;
  white-space: nowrap;
}
ul li a:hover { 
  background: #617F8A; 
}

li:hover ul {
  display: block;
  position: absolute;
}

li:hover li {
  float: none;
  font-size: 11px;
}

li:hover a { 
  background: #617F8A; 
}

li:hover li a:hover { 
  background: #95A9B1; 
}

Upvotes: 1

Views: 1293

Answers (1)

garetheddies
garetheddies

Reputation: 11

Are you missing some code from your examples or is this the exact code, because I think you'r missing the close

</ul>

?

Upvotes: 1

Related Questions