Horizontal menu should not have a fixed height on the UL

[jconniff]

These comments are about horizontal menus, not vertical menus.

in menus-core.css
line 60
There is a fixed height given to the ul. I don't believe this should be done.

.pure-menu.pure-menu-horizontal > ul {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
    height: 2.4em;  /* I believe this should not be here */
}

This becomes a problem when the developer wants a menu background color that is different than the page background (a common case). A couple pixels of menu background color shows under the selected menu item.

and/or if the developer wants to customize the padding of the menu items

[skegel13]

This also seems to cause problems if the menu gets wrapped on a smaller screen. The second row of items won't have a background color if the height is set.

[ddelrio1986]

This also caused another issue on smaller screens. The content beneath the menu will go behind the wrapped part of the menu.

[AurelioDeRosa]

I agree. I tried deleting that rule on the Pure website using Chrome, Firefox and Opera on Windows and nothing change.

[ericf]

Since Menus is getting a revamp, I think we should focus on #142 and see if the problem exists there.

[msridhar]

Is there any kind of workaround for this issue until #142 is merged? I get bitten by the problem of content beneath the menu going underneath the wrapped part on smaller screens.

[ericf]

@msridhar my guess would be to make sure the menu items are vertical-align: top; and set the height: auto; where @jconniff suggests in this issue's description.