Menu déroulant CSS

Menu déroulant CSS - HTML/CSS - Programmation

Marsh Posté le 18-12-2009 à 15:25:22    

Bonjour !
 
Je voudrais créer un menu déroulant en CSS sans javascript.
 
Voilà mon CSS :

Code :
  1. #menu {
  2. height:50px;
  3. }
  4. #menu ul {
  5. margin:0;
  6. padding:0;
  7. list-style-type:none;
  8. text-align:center;
  9. }
  10. #menu li {
  11. float:left;
  12. margin:auto;
  13. padding:0;
  14. background-color:black;
  15. }
  16. #menu li a {
  17. display:block;
  18. width:100px;
  19. color:white;
  20. text-decoration:none;
  21. padding:5px;
  22. }
  23. #menu li a:hover {
  24. color:#FFD700;
  25. }
  26. #menu ul li ul {
  27. display:none;
  28. }
  29. #menu ul li:hover ul {
  30. display:block;
  31. }
  32. #menu li:hover ul li {
  33. float:none;
  34. }


 
Et mon menu HTML :

Code :
  1. <div id="menu">
  2. <ul>
  3.   <li><a href="#">Item 1</a></li>
  4.   <li><a href="#">Item 2</a>
  5.     <ul>
  6.       <li><a href="#">Sous-item 1</a></li>
  7.       <li><a href="#">Sous-item 2</a></li>
  8.       <li><a href="#">Sous-item 3</a></li>
  9.  </ul>
  10.   </li>
  11.   <li><a href="#">Item 3</a></li>
  12. </ul>
  13. </div>


 
Ca fait exactement ce que je veux sauf que ... le sous menu apparait en dessous de l'item 2 et je voudrais qu'il apparaisse au dessus ...
Vous auriez une idée de comment procéder ?
Merci !!
 
Sandra


Message édité par sandy kylo le 18-12-2009 à 15:25:58
Reply

Marsh Posté le 18-12-2009 à 15:25:22   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed