menu déroulant

[florian95]

Bonjour,

 

j'essaye de faire un menu déroulant mais je n'y arrive pas voici mon code html :

 

<ul class="menu" >
 <li><a href="http://matcha-zen.com/fr/" target="_self" title="{l s='Home'}">{l s='Home'}</a></li>
  <li><a href="{$base_dir}new-products.php" target="_self" title="{l s='Shop'}">{l s='Shop'}</a></li>
   <li><a href="http://matcha-zen.com/blog/" target="_self" title="{l s='Blog'}">{l s='Blog'}</a></li>
 <li><a href="*" title="{l s='Matcha'}">{l s='Matcha'}</a>
			  <ul>  <li><a href="#">connexion</a></li>
				    <li><a href="#">inscription</a></li>
  </ul>

</li>

 <li><a href="http://matcha-zen.com/fr/content/7-recettes-matcha" target="_self" title="{l s='Recipes'}">{l s='Recipes'}</a></li>
 <li><a href="http://matcha-zen.com/fr/content/21-faq" target="_self" title="{l s='FAQ'}">{l s='FAQ'}</a></li>
<li><a href="{$base_dir}contact-form.php" title="{l s='Contact us'}">{l s='Contact us'}</a></li>

</ul>

 

 

et mon css :

ul.menu {
position : absolute;
list-style-type:none;
display:block;
height:34px;
width : 990px;
font-size:14px;
background-color:transparent;
font-family:Verdana,Helvetica,Arial,sans-serif;
margin-top:268px;
padding-left:30px;
font-weight:bold;
text-shadow:#000;
text-transform:uppercase;
}
ul.menu {
position : absolute;
list-style-type:none;
display:block;
height:34px;
width : 990px;
font-size:14px;
background-color:transparent;
font-family:Verdana,Helvetica,Arial,sans-serif;
margin-top:168px;
padding-left:30px;
font-weight:bold;
text-shadow:#000;
text-transform:uppercase;
}
ul.menu li {
display:block;
float:left;
margin:0;
padding:0;
}
ul.menu li a {
float:left;
color:white;
text-decoration:none;
text-decoration:none;
background : url(../img/separate.png) no-repeat right;
font-family:Arial;
height:35px;
padding:10px 15px 0;
}
ul.menu li a:hover,.current {
color:white;
background : url(../img/separate.png) no-repeat right;
text-decoration:none;
}
ul.menu .current a {
color:#fff;
font-weight:700;
}

 

 

Merci pour votre aide