Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Horizontal menu should not have a fixed height on the UL #164

Closed
jconniff opened this issue Aug 14, 2013 · 6 comments
Closed

Horizontal menu should not have a fixed height on the UL #164

jconniff opened this issue Aug 14, 2013 · 6 comments
Labels
Milestone

Comments

@jconniff
Copy link
Contributor

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.

pure_menu_ul_height

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

@skegel13
Copy link

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
Copy link

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

@AurelioDeRosa
Copy link
Contributor

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

@ericf
Copy link
Collaborator

ericf commented Sep 12, 2013

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

@msridhar
Copy link

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
Copy link
Collaborator

ericf commented Oct 14, 2013

@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.

tilomitra added a commit to tilomitra/pure that referenced this issue Nov 25, 2013
ericf added a commit that referenced this issue Nov 25, 2013
Fix #164: Remove hard-coded height for horizontal menus
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

6 participants