[Resolved] How to vertical align center nav menu and logo.

[Ian]

After adjusting the logo size, the primary nav menu is slightly higher than vertical center. Is there a way to align it vertical center? Custom CSS maybe? The Sticky menu is fine as that logo is smaller in height.

[David]

Hi there,

try increasing the Menu Item height in Customizer > Layout > Primary Navigation (desktop size) to match that of your logo height.

[Ian]

And that solved it! Noticed I had already adjusted this during the build but missed that I had to adjust it again after the logo resize. Thanks David!

[David]

Glad to be of help

[Ian]

Just a heads up, making the logo wider had a side effect. It started to wrap the hamburger menu down to the next line in mobile mode. Let me try and adjust some things to make this perfectly line up.

[David]

It autowraps if there isnt enough room for it.
You can strip off the top and bottom padding if you want to enlarge it without impacting that so much:

.site-logo.mobile-header-logo img {
    padding-top: 0;
    padding-bottom: 0;
}

[Ian]

Thanks David. Appreciate that. Will keep tweaking.

[David]

You’re welcome

[An Nguyen]

It’s worked for me. Logo is enlarged as I expect in mobile mode. Thanks David.

[Author]

Posts