menu wordpress de style

Question

J'essaie de styler un menu de navigation que j'ai créé en utilisant quelques css. Je veux que la couleur d'arrière-plan du menu change lorsque l'utilisation passe au-dessus de l'élément de menu. Le menu est appelé 'menu barre latérale'

La difficulté que je rencontre est que la couleur d'arrière-plan remplisse l'élément de menu lorsque survolée. La couleur d'arrière-plan du lien change, mais je ne remplis pas le menu réel article. J'ai essayé rembourrage, quel type d'œuvres, mais il ne pas remplir correctement l'élément de menu .... Aide

Ceci est mon css jusqu'à présent: -

/* The SideBar menu styling*/ 
#menu-side-bar-menu li { 
list-style-type: none; 
border-bottom: 1px solid #D6D6D6; 
background-color: #f2f1f1; 
margin: 0px 0px 0px 20px; 
padding: 5px 10px 5px 10px; 
} 

#menu-side-bar-menu a { 
color: #BA9E2F; 
} 

#menu-side-bar-menu li a:hover { 
background: #BA9E2F !important; 
color: #fff; 
padding-top:8px; 
padding-bottom:9px; 
} 

C'est un link au page J'essaie de coiffer. Son menu sur la gauche de la page

Answer 1

3 choses à faire:

1.) retirer la padding de #menu-side-bar-menu li complètement

2.) Ajouter le rembourrage que vous aviez pour li-#menu-side-bar-menu a et ajouter à display: block à avoir li entièrement rempli par a

3.) Retirez le padding de la règle #menu-side-bar-menu li a:hover pour éviter un changement de taille en vol stationnaire.

Il en résulte le CSS suivant:

#menu-side-bar-menu li { 
    list-style-type: none; 
    border-bottom: 1px solid #D6D6D6; 
    background-color: #f2f1f1; 
    margin: 0px 0px 0px 20px; 
} 

#menu-side-bar-menu a { 
    display: block; 
    color: #BA9E2F; 
    padding: 5px 10px 5px 10px; 
} 

#menu-side-bar-menu li a:hover { 
    background: #BA9E2F !important; 
    color: #fff; 
} 

Answer 2

S'il vous plaît, essayez ceci:

.sub-menu li { 
    margin: 0; 
    width: 100%; 
} 

.sub-menu li a { 
    width: 100%; 
    padding-left: 40px; 
} 

Il a travaillé dans l'inspecteur.