[Resolved] Image in Menu Causing Extra Height to Be Added, Can't Figure Out Why

[Brian]

I added a menu image and now there is 25px in extra height being added and I can’t figure out why or where.
http://capitalaquarium.com/

[Leo]

Hi Brian,

I would recommend adding that image as a navgiation logo instead of menu item.
https://docs.generatepress.com/article/navigation-logo/

Then add this CSS if you want it on the right:

.site-logo.sticky-logo {
    float: right !important;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know if this helps.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Brian]

Thank you, With it as a navigation logo it does not add the extra space, but then the navigation logo floats all the way to the right, still not next to the menu. Is there any way to get the navigation logo against the menu, not against one side of the screen or the other?

[Tom]

Using the image as a menu item, you can use this CSS to make them align properly:

.main-navigation li {
    position: relative;
    vertical-align: middle;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Brian]

THANK YOU!

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts