Align navigation to bottom of logo

[Matt Bateman]

Is there a way to align the bottom of the navigation to the bottom of the logo?

[Anonymous]

Hi Matt,

Please use the following css to fix the issue :

.flat_responsive_menus {
    float: left;
    width: 100%;
}

ul.navmenu {
    float: left;
}

Note: Please use the custom css plugin or Child theme so the changes does not lost on theme updates.

Thanks

[Matt Bateman]

Thanks for the quick reply, but that puts it below the logo. I want it in the space next to the logo (like it is by default), but instead of up near the top, I want it at the bottom of the space. It seems like vertical-align: bottom should do it, but that does not seem to work. Ideally, I would like it all the way to the right, with the bottom of the menu type aligned with the bottom of the logo graphic.

[Saskia Lund]

vertical-align:middle does not work, becaus for this to work you must display the containing divs or elements as table-cells.
This is not the case here.

To get the text aligned properly, you can use the height of the logo as it’s line-height in css and minus values in bottom padding.

Good luck.

[Anonymous]

Hi Matt,

You can add the code of line in css as bellow:

ul.navmenu > li > a {
    vertical-align: -41px;
    line-height:20px;
    display:inline-block;
} 

Please use the value of line-height and and vertical align as your requirement. if any problem with that, please send us the url of the site so that we could give solution fast.

Note : Please use the custom css plugin or child theme for writing css.

Thanks

[Author]

Posts