drop-down menu items

Very useful feature for menu displaying is drop-down menu items. Very often this feature is resolved using complex and huge pile of javascript.
I found a solution in pure css.

Here we are.
First, create layout in unordered list.

	
 Main menu 1
              

	            
Sub menu 1
	            
Sub menu 2
              
        
	
Main menu 2

And now show excerpt from css we need to show how it works.

#menu li:hover ul.submenu {
    display: block;
}
#menu li ul.submenu {
    display: none;
    position: absolute;
    margin: -20px 0 0 130px;
}
#menu li ul.submenu li {
    background: #FFFFFF;
    float: none;
    position: relative;
    width: 200px;
    padding: 5px;
    z-index: 10;
}

Here is working example.