menu déroulant en CSS?

Question

Je cherche un moyen de construire un menu déroulant. Fondamentalement, j'ai un site Web qui a des boutons différents en bas et certains d'entre eux devraient avoir des menus déroulants de sorte que quelques boutons apparaissent dessus au passage de la souris. Oh, et j'aimerais avoir une solution qui fonctionne sans grandes bibliothèques et peut-être même sans javascript (mais c'est juste parce que c'est plus propre, une solution avec javascript fonctionnerait aussi).

Edit: Voici quelques code:

HTML:

<div class="toolbarElement" id="toolbarViewUsers"> 
    <img src="images/usericon.png" /> 
    List users 
</div> 
<div class="toolbarElement" id="toolbarSettings"> 
    <img src="images/settings.png" /> 
    Settings 
</div> 
<div class="toolbarElement" id="toolbarLogout"> 
    <img src="images/logout.png" /> 
    Logout 
</div> 

CSS:

.toolbarElement img { 
display: block; 
} 

.toolbarElement { 
float: left; 
text-align: center; 
margin-left: 3px; 
margin-right: 3px; 
} 

Voici comment il semble:

Edit 2: Maintenant j'ai essayé, mais je ne sais pas encore comment placer le sous-menu au-dessus du toolbarElement:

CSS:

.toolbarElement { 
float: left; 
text-align: center; 
margin-left: 3px; 
margin-right: 3px; 
position: relative; 
} 

.submenu { 
position: absolute; 
bottom: 0px; 
left: 0px; 
} 

HTML:

<div class="toolbarElement" id="toolbarSettings"> 
<img src="images/settings.png" /> 
Settings 
<div class="submenu"> 
    Hallo 
</div> 
</div> 

Answer 1

Voici ce que je pense est un bon exemple:

jQuery multi-tiered drop-up menu

Regardez la démo here.

BTW juste un avertissement de la démo a de tomber en chemin vers le bas dans le coin gauche, appelez-moi un idiot mais je rafraîchi 5 fois avant que je l'ai vu :)

Bonne chance