menu desplegable en CSS

[rockobop]

hola Mikmoro

veo q eres un maestro de css espero me puedas echar una mano

mira te muestro mi css y mi html logre hacer un menu horizontal pero despues de batallar y hacer el submenu viejo me rendi no me sale pro ningun lado

Codigo HTML

Código HTML:

<div id="barizquierda">
                            
                            <h2 class="hide"></h2>
                        <ul class="avmenu" class="current">
                            <li><a href="index.html">Inicio</a></li>
                            <li><a href="styles.html">Informacion</a></li>
                            <li><a href="2-columns.html">Clientes</a></li>
                            
                                    <li><a href='infoClientes.php'>Nuestros Clientes</a></li>
                                    <li><a href='fotosClientes.php'>Fotos</a></li>
                            </ul>
                            <li><a href="3-columns.html">Nuestro Trabajo</a></li>
                            <li><a href="themes.html">Album de Fotos</a></li>
                            <li><a href="themes.html">Contacto</a></li>
                        </ul>
</div> 

bueno la idea como veraz es q pasando el mose sobre clientes aparezca el sub menu bueno hay varios niveles mas y otros submenus pero creo q con una idea ya podre resolver el resto

Codigo CSS

Código HTML:

#barizquierda ul.avmenu {list-style:none; 
margin:0 0 18px; 
padding:0; 
width:150px;}

#barizquierda ul.avmenu li {display:inline; 
padding:0; 
width:150px;}

#barizquierda ul.avmenu li a {background:url(images/dolphin_bg.gif) repeat-x bottom left #f4f4f4; border-bottom:1px solid #d8d8d8; 
border-left:4px solid #ccc; 
border-right:1px solid #d8d8d8;
 border-top:1px solid #d8d8d8; 
 color:#FFFFFF; 
 float:left; 
 font-size:1em; 
 font-weight:700; 
 margin-bottom:5px; 
 padding:5px 1px 5px 5px; 
 text-decoration:none; 
 width:138px;}
 
#barizquierda ul.avmenu li a:hover,#barizquierda ul.avmenu li a.current {background:url(images/dolphin_bg-OVER.gif) repeat-x bottom left #eaeaea; 
border-bottom:1px solid #b0b0b0; 
border-left:4px solid #505050; 
border-right:1px solid #b0b0b0; 
border-top:1px solid #b0b0b0; 
color:#FFFFFF;}

#barizquierda ul.avmenu ul {font-size:0.9em; 
margin:0 0 0 15px; 
padding:0 0 5px 0; 
width:133px;}

#barizquierda ul.avmenu ul a {padding:3px 1px 3px 5px; 
width:123px;}
#barizquierda ul.avmenu ul ul {font-size:1em; 
width:120px;}

#barizquierda ul.avmenu ul ul a {width:108px;}

gracias por todo, y si alguien tb podria colaborar bien venido sea

saludos