Simple drop down menu

Example I took from here, but from the css and html I deleted parts which are needed for beautification.

HTML should be simple:

    <ul>
        <li>
            Menu 1
            <ul>
                <li>
                    Menu 1 SubMenu 1
                </li>
                <li>
                    Menu 1 SubMenu 2
                </li>
                <li>
                    Menu 1 SubMenu 3
                </li>
            </ul>
        </li>
        <li>
            Menu 2
            <ul>
                <li>
                    Menu 2 SubMenu 1
                </li>
                <li>
                    Menu 2 SubMenu 2
                </li>
            </ul>
        </li>
        <li>Menu 3</li>
    </ul>

CSS:

ul {
    list-style: none; //I dont need bullets
    padding: 0px; //so that submenus are under main menu correctly aligned
}

ul li {
    position: relative;
    float: left;
}

li ul {
    display: none; //sub menus will not be displayed
}

li:hover ul {
    display: block; //display submenus when mouse is over
    position: absolute;
}

Real life example

• Menu 1
  • Menu 1 SubMenu 1
  • Menu 1 SubMenu 2
  • Menu 1 SubMenu 3
• Menu 2
  • Menu 2 SubMenu 1
  • Menu 2 SubMenu 2
• Menu 3