Problème de menu CSS dans IE

Vous rencontrez un problème avec le menu CSS dans IE. C'est mon premier tir sur CSS Menus, donc bien sûr il va y avoir des mésaventures. :) Il est censé afficher les éléments de la liste sous l'en-tête de la liste, mais à la place il est affiché à droite. Il apparaît parfaitement dans Firefox, mais (bien sûr) pas dans IE.Problème de menu CSS dans IE

Que se passe (IE): http://vvcap.net/db/7Ti_aj74IaQjwyX7rk43.htp

Mais il est censé afficher les éléments de liste directement sous l'en-tête de "Marketing".

code:

ul 
{ 

background:orange; 
height:25px; 
list-style:none; 
margin:0 auto; 
} 
li{ 

    float:left; 
    padding:0px; 
    } 
li a{ 

    background: url("images/seperator.gif") bottom left no-repeat; 
    color:white; 
    display:block; 
    font-weight:normal; 
    line-height:25px; 
    text-align:center; 
    text-decoration:none; 
    } 
li a:hover, ul li:hover a{ 

    background: #2580a2 url('images/seperator.gif') bottom left no-repeat; 
    z-index: 1; 
    color:#FFFFFF; 
    text-decoration:none; 
    } 
li ul{ 

    background:#333333; 
    display:none; 
    height:auto; 
    position:absolute; 
    width:156px; 
    z-index:500; 
    } 
li:hover ul{ 

    display:block; 
    z-index:1; 
    } 
li li { 

    background:url('images/sub_sep.gif') bottom left no-repeat; 
    display:block; 
    width:156px; 
    } 
li:hover li a{ 

    background:none; 
    } 
li ul a{ 

    display:block; 
    height:25px; 
    font-size:12px; 
    font-style:normal; 
    padding:0px 10px 0px 15px; 
    text-align:left; 
    } 
li ul a:hover, li ul li:hover a{ 

    background:#2580a2 url('images/hover_sub.gif') center left no-repeat; 
    color:#ffffff; 
    text-decoration:none; 
    width:131px; 
    }

Source

2010-06-23 SportsFan33

En l'absence d'échantillon html, je frappais la suivante, avec votre css (telle que publiée ici) dans une balise de style dans la tête.

<!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> 
<title>test</title> 
<style type="text/css"> 
/* Your CSS */ 
</style> 
</head> 
<body> 

<table class= "table1" cellpadding="0" cellspacing="0" align ="center"> 
    <tr> 
    <td width = "20%"> 
     <ul> 
     <li><a class ="linkDrop" href="Default.aspx">Home</a> </li> 
     </ul> 
    </td> 
    <td> 
     <ul> 
     <li> 
      <a class ="linkDrop" href="#">Miscellaneous</a> 
      <ul> 
      <li><a href="#">Subitem 1</a></li> 
      <li><a href="#">Subitem 2</a></li> 
      <li><a href="#">Subitem 3</a></li> 
      </ul> 
     </li> 
     </ul> 
    </td> 
    <td> 
     <ul> 
     <li> 
      <a class ="linkDrop" href="#">Miscellaneous</a> 
      <ul> 
      <li><a href="#">Subitem 1</a></li> 
      <li><a href="#">Subitem 2</a></li> 
      <li><a href="#">Subitem 3</a></li> 
      </ul> 
     </li> 
     </ul> 
    </td> 
    </tr> 
</table> 

</body> 
</html>

Cela a fonctionné correctement une fois que j'ai ajouté un doctype. Y a-t-il une chance que ce soit ce qui vous manque?

--edit -

d'accord, je mis à jour le code ci-dessus avec ce que je lis vos commentaires et de la dernière doublais td juste pour voir si cela fait une différence pour moi.

Il semble que ce soit bien dans IE8 et IE8 en mode IE7. Il ne parvient pas à faire quoi que ce soit en mode Quirks ou en mode Compatibilité. Si c'est IE6 vous rencontrez des problèmes, alors le problème est que la classe: hover psuedo n'est récupérée que par IE6 lorsqu'elle est appliquée aux balises d'ancrage (a), donc votre li:hover ul sera ignorée.

Si vous voulez que cela fonctionne dans IE6, vous aurez besoin d'ajouter du JavaScript. Il ya un bon article sur ALA: http://www.alistapart.com/articles/horizdropdowns/

Source

2010-06-23 22:15:35 staticbeast

J'ai copié et collé votre code et cela a fonctionné ... sur une page de test. Cependant, quand je l'ai mis sur ma page maître (où se trouvent ces listes déroulantes), il a de nouveau cassé dans Internet Explorer. Cela aurait-il quelque chose à voir avec une page maître?Voici ma source d'ép a été rompu avant:

Home

– SportsFan33

la répétition du TD tout le chemin à travers, mais je suis sorti de personnages J'ai d'autres comme ceci:

Miscellaneous

– SportsFan33

J'ai modifié ma réponse avec votre code mis à jour et une autre pensée sur ce que le problème pourrait être. – staticbeast

Problème de menu CSS dans IE

Répondre

Questions connexes