[Resolved] Mobile Header Height

[Lucy]

Hello GeneratePress team

Apologies as I have spent too many hours trying to resolve this and it feels like I keep making it worse!

I would like the logo and menu to be on the same line in the header without too much space – I have tried uploading a smaller logo, adjusting the height and nothing seems to work.

Your advice would be much appreciated!

[Lucy]

UPDATE – I may have improved it but it still has extra white padding at the bottom that doesn’t appear in the Sticky Menu. Any advice on this would be much appreciated

[David]

Hi there,

are you using the Mobile Header:

https://docs.generatepress.com/article/mobile-header/

If so the logo and the menus height is defined by the Menu Item height set in in the Primary Navigation – you can set it separately for Mobile by selecting the Mobile responsive view.

[David]

Try setting the menu toggle line-height to match your icons eg.

#mobile-header .menu-toggle {
	line-height: 37px;
}

[Lucy]

Hi David

Thank you so much for your time.

Yes I am using the Mobile Header – it still doesnt remove the padding and space below and seems to have now doubled.

I also used this as found on that page you shared but it doesn’t make a difference

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

I tried the below but it only moved the menu out of line with the logo and I want to keep them n line.

#mobile-header .menu-toggle {
line-height: px;
}

[Lucy]

Ignore I think I have solved it, there was padding on my top section on the pages and when I remove it seems to now have fixed the issue!

Thank you for your help!

[David]

Glad to hear you got it resolved.

[Author]

Posts