Basic <ul> sub-menu not visible on page

css, html

Solution

http://jsfiddle.net/4EmJ9/2/

you had some `overflow: hidden` on 2 parent elements. I have updated your css.

.customNav {
    /*overflow: hidden;*/
    height: 30px;
    background: #5e5e5e;
}

.s4-tn {
    margin-left: 0px;
    /*overflow: hidden; */
    height: 30px;
}

Problem

I have a basic horizontal html menu with a structure similar to this: ``` <ul> <li> Menu item 1 <ul class="sub-menu"> <li>Sub item 1</li> </ul> </li> <li>Menu item 2</li> </ul> ``` Please see for http://jsfiddle.net/4EmJ9/ for full example. (The menu in question contains the text Bernalillo) The problem: `.sub-menu` is completely hidden. I can see it is positioned correctly (using inspect element), and I have also played with z-index and container heights, but to no avail. Constraint: I can change ONLY css. The HTML (which may make you cry) is locked up in Sharepoint until the end of time. Editing Javascript is out too. Any thoughts as to how to make the sub menu show up?

Original source