overlapping floats: z-index doesn't work

I'm trying to write a ho开发者_开发问答rizontal navigation bar with simple drop down menus (again horz). The main menu displays fine. To hide the submenus when not hovering, I did

ul#submenu {
    visibility: hidden;
    display: inline;
    position: absolute;
    top: 10pt;left: 0;
}

ul#mainmenu li:hover ul#submenu li {
    visibility: visible;
    position: relative;
    float: right;
}

The visibility and appear on hover work fine. However, part of the submenu gets hidden under the float right below. I tried setting z-index: 0 for that and z-index: 1 for the submenus, but it still doesn't work. How do I bring it to the top?

---

Check if overflow: hidden; or overflow: auto is set in the parent div. That could prevent it from showing up.