How to make sub menus in a dropdown menu?

Question

I have a drop down menu made in css. When you hover over the text (ul) the menu appears (the li appears). I wanted to know, how to make a submenu, that when you hover over the li's another menu (submenu) would appear and would offer other options.

Ex:

-Tutorials (You hover over tutorials)
           (Then these options appear)         
        -Video tutorials
        -Other tutorials
        -Windows (and if you hover over windows you have 3 choices)
                  //How do I make that!
                  -Windows xp
                  -windows 7
                  -Windows Vista

That is what I want to make.

Thanks people!!

Answer 1

CSSPlay is a great resource with all kinds of menu's you can possibly imagine. Plus all menu's are completely cross-browser. Check it out, I'm sure Stu got one that fits your needs: http://www.cssplay.co.uk/menus/

Answer 2

you need this tutorial: son of suckerfish dropdowns

Answer 3

If you're using pure CSS then you just need to add a new level of styles. You haven't posted your original code, but assuming you currently have something like:

ul.menu > li > ul {
  display: none;
}
ul.menu > li:hover > ul {
  display: block;
}

Then you'd simply need to add:

ul.menu > li > ul > li > ul {
  display: none;
}
ul.menu > li > ul > li:hover > ul {
  display: block;
}

You will of course need to add some positioning code to your third level list so it appears to the right of the active menu item.