Modify height of menu and submenu

  • Anonymous



    I have almost completed the customization of my site, but there’s one thing I still can not achieve.

    I want to change the height of the sub menu to make it identical to the height of the menu.

    I changed the height of menu to 40px like this:

    # nav. menu {

    width: 100%;

    height: 40px;


    How to do the same for the sub menu?

    And finally, how to center the text in the menu?

    Because if I increase the height of the menus, the text is placed at the top.

    Thank you for your work on Graphene, it is really great!



    Okay, first your nav menu height is currently 29px; not 40px.

    To make sub-menu pages a height of 40px, add this to custom css:

    #header-menu ul li {
    height: 40px;



    yes I know, 40px was an example, I found how to do, I begin to understand how CSS works;-)

    It’s very nice to learn this technology….

    And for centering the text vertically on the menu?

    I mean, if I increase the height of my menu, the text is no longer centered vertically but remains at the top.

    Thanks for your answer!



    Right. To do that, you’ll need to add some padding to the top of the text. Something like this would probably work:

    #header-menu > li > a {
    padding: 15px 10px 10px;

    You can change the 15px to whatever you like… as this is the padding for the top. The two 10’s are for the side and the bottom… you can leave them alone.

Viewing 4 posts - 1 through 4 (of 4 total)

  • You must be logged in to reply to this topic.
Graphene Themes Forum