Archived topic
Header sticking out from the container
7 replies · Started by Carsten on August 4, 2021
Hi there, I have an issue with my header which is not contained, despide the settings.
Why is the header sticking out from the container, and how do I fix it?
My Mobile Menu Breakpoint for the primary navigation is set to 2000, to keep the mobile menu burger on desktop as well.
Apparently there are no settings for the primary menu for adding padding or margin to the left of the menu when set to mobile?
Thanks!
Hi Carsten,
Any chance you can link us to the site in question?
You can use the private information field.
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Let me know :)
Hi Ying, sure
Ah, I see, since the mobile breakpoint is set to 2000px, so the site is using the mobile header instead of the desktop header.
That's why the customizer setting for the desktop header doesn't apply.
You can try this solution:
1. Set Mobile Menu Breakpoint to default which is 768px.
2. Set Off Canvas Panel to on.
3. Create a new empty menu with no menu item at all, and assign it to primary navigation.
https://www.screencast.com/t/mmS2lirlh
Let me know how it works :)
Hi Ying, thanks for bringing up a solution, just to understand this right, setting the mobile breakpoint to 2000 was causing the header to exceed the container width?
Yes.
If you set the mobile breakpoint to 2000px, on a screen that is wider than 2000px, it should look normal which means contained.
But on a screen that is narrower than 2000px, the mobile header will kick in, the header will become full width.
Hi Ying, thanks for the clarification
Regards
Carsten
No problem :)
