CSS menu déroulant sur indenter menu déroulant

Question

Le jsFiddle est here

Je ne peux pas comprendre pourquoi il y a un « tiret » dans le menu déroulant des liens. S'il vous plaît aider? Je ne suis pas un expert en la matière, donc cela m'embrouille.

#nav{ 
    list-style:none; 
    font-weight:bold; 
    margin-bottom:10px; 

    float:left; 
    width:100%; 

    position:relative; 
    z-index:99; 

} 
#nav li{ 
    float:left; 
    margin-right:10px; 
    position:relative; 
} 
#nav a{ 
    display:block; 
    padding:5px; 
    color:#fff; 
    background:#333; 
    text-decoration:none; 
} 
#nav a:hover{ 
    color:#fff; 
    background:#6b0c36; 
    text-decoration:underline; 
} 

#nav ul{ 
    background:#fff; 
    background:rgba(255,255,255,0); 
    list-style:none; 
    position:absolute; 
    left:-9999px; 
} 
#nav ul li{ 
    padding-top:1px; 
    float:none; 
} 
#nav ul a{ 
    white-space:nowrap; 
} 
#nav li:hover ul{ 
    left:0; 
} 
#nav li:hover a{ 
    background:#6b0c36; 
    text-decoration:underline; 
} 
#nav li:hover ul a{ 
    text-decoration:none; 
} 
#nav li:hover ul li a:hover{ 
    background:#333; 
} 

#nav ul{ 
    background:#fff; 
    background:rgba(255,255,255,0); 
    list-style:none; 
    position:absolute; 
    left:-9999px; 
} 

#nav ul li{ 
    padding-top:1px; 
    float:none; 
} 
#nav ul a{ 
    white-space:nowrap; 
} 
#nav li:hover ul{ 
    left:0; 
} 
#nav li:hover a{ 
    background:#6b0c36; 
    text-decoration:underline; 
} 
#nav li:hover ul li a:hover{ 
    background:#333; 
} 

et le html est dans le jsfiddle.

Answer 1

UL a un remplissage par défaut afin que les points de balle n'apparaissent pas en dehors de la liste.

Juste ajouter de la considération à votre ul comme;

#nav ul { 
    margin: 0; 
    padding: 0; 
} 

JSFiddle

Hope this helps, acclamations.

Answer 2

La marge droite de 10 px est à l'origine du tiret

#nav li{ 
    float:left; 
    margin-right:10px; 
    position:relative; 
} 

Essayez ceci:

#nav li{ 
    float:left; 
    margin-right:0; 
    position:relative; 
}