Archived topic
Full width page messes up navigation (in Elementor)
11 replies · Started by Dan on March 19, 2022
Hi there,
When I set the page to full width using Generatepress, it creates a problem/glitch with the top navbar - basically, it makes some elements transparent/disappear until scrolling.
If I don't have full page width set, the page will still load full width but always loads in clunky - as in it first loads boxed, and then pulls out a second or two later, but this happens across every page and looks kind of ugly.
I contacted Elementor support and they said this is something happening within the Generatepress theme - I tried testing with the Elementor Hello theme and I don't have the same problem come up.
Any idea how I could fix this within Generatepress?
Thank you.
Hi there,
I can't see how this would be a GP issue - the header and navigation is entirely coming from Elementor.
Can you follow up with Elementor's support to see why they think it's a GP issue? They often blame the theme when they can't determine the issues themselves.
The Hello theme is also not a good theme for testing.
Thanks for the quick response.
Using the full width setting with Hello Theme seems to work without any glitch, which is maybe why they are saying it is to do with Generatepress settings in some way.
Is there nothing you can see why this would be happening on the GP side?
The header and navigation is coming from Elementor so I really don't see why GP would be the cause here.
As mentioned, the Hello theme is also not a standard theme for testing.
I'm also not seeing the full width setting applied on the home page of the linked site:
https://docs.generatepress.com/article/content-container/
Hi again Leo,
The problem is that when I select the full width container as you mention, it messes up the top navbar as I described, which is why it is off right now.
If the Hello theme is not a standard theme for testing, what one should I try instead to help troubleshoot this more?
Please let me know your thoughts. Thanks.
Hi there,
We need to see the actual problem on the site, if you can temporarily enable the GP theme and the Full Width option then we can take a look.
The provided link has the GP theme installed/running with the full width layout. You'll see the navbar is glitching out compared to the other pages.
Let me know any thoughts when you can, thanks.
Odd one - I cannot see anything interfering with the layout but the issue is related to z-index.
If you select that Elementor section that contains the Navigation can you increase its z-index value ?
Any number I added - be it 5 or 25 - seemed to fix the issue except now it causes the header to overlap the body under it - is there any theme level spacing I could correct this with or should I do this also within Elementor?
Edit - I actually noticed I had margin on this page. Maybe it is now correcting another problem that was always there! Strange.. also, when I add a Z index number, update, it works, and even if I delete that number and hit update again, it still works after.
Is that now resolved ?
I think so. Thanks.
Glad to hear that!
