Accordion menu wordpress

I wish to create an accordeon menu in wordpress. For the moment, I created my menu and I’m displaying my children pages, but I can’t seem to display them when I’m doing a hover. Here’s my CSS code :

    /***Menu***/
#header #access{position:relative;
z-index:2;
width:1225px;
min-width:1225px;
float:center;
margin-left:auto !important;
margin-right:auto !important;
top:274px;
text-align:center;}

#header .menu ul { width:1185px; 
height:40px;color:black;
text-align:center;
margin-right:auto !important;
list-style:none;}

#header .menu li { display:block;
float:left; 
width:206px; 
height:40px; 
font-size:17.5px; 
text-decoration:none;
background-color:#c4d8ff; 
color:black; 
margin-right:31px;}

#header .menu li a { display:block; 
width:206px; 
height:40px; 
text-decoration:none;
color:black; 
font:17px segoe; 
vertical-align:center; 
line-height:40px;}

#header .menu li a:hover { background-color:#e27c23;
color:white; 
margin-right:31px;}

#header .menu li.current_page_item a { background-color:#3670b5; 
color:white; 
width:206px; 
height:40px; 
margin-right:31px;}

/***Sous-menu***/
ul.sub-menu{background-color:red;
margin-left:-20px;
list-style:none;}

ul.sub-menu li {background-color:blue !important;
margin-left:-40px; 
clear:left;
list-style:none;}

ul.sub-menu li a { }

ul.sub-menu li a:hover {background-color:black !important;}

ul.sub-menu li.current_page_item a {background-color:green !important; }

Can someone tell me wich css property I have to use to do that ? and where ? Thanks a lot !

Related posts

Leave a Reply