liste ne montre pas IE en ligne?

Question

Le code ci-dessous fonctionne correctement sous Firefox, mais la liste ne s'affiche pas en ligne avec IE.

<div id="nav">
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>
    </ul>
</div>

CSS:

#nav
{
    width: 800px;
    padding: 0px; 
    margin: 0 auto; 
    list-style-type: none;  
}

#nav ul li a 
{
    font-size: 18px;    
    text-decoration: none;   
    text-align: center;  
    color: #ffffff;   
    background-color: #003366;   
    padding: 20px;
    list-style: none;
    float: left; 
    list-style-type: none; 
    line-height: 5px; 
    display: inline; 
    margin-left: 5px; 
}

#nav ul li a:hover 
{
    background-color: #ccc;
}

Également dans IE, les puces sont toujours affichées?

Answer 1

#nav
{
    width: 800px;
    padding: 0px; 
    margin: 0 auto; 
    list-style-type: none;  
}

#nav ul li
{
    text-align: center;  
    background-color: #003366;   
    list-style: none;
    list-style-type: none; 
    margin-left: 5px; 
    display: inline; 
    float: left; 
}

#nav ul li a 
{
    font-size: 18px;    
    text-decoration: none;   
    color: #ffffff;   
    line-height: 5px; 
    padding: 20px;
    display: inline-block; 
}

#nav ul li a:hover
{
    background-color: #ccc;  
}

Answer 2

Je pense que votre problème est que vous avez mis le CSS sur #nav ul li a, et que cela devrait être sur l'élément #nav ul li.

Vérifiez cet article pour une très bonne explication sur le style de liste. La section sur les listes en ligne devrait vous intéresser particulièrement.

Answer 3

Vous mettez du type liste-style sur votre div mais pas sur votre élément ul. list-style-type n'est pas hérité des éléments non listés dans IE.