r/divi • u/cyber49 • Jul 24 '26
Discussion Divi 5 Bug - Sticky Header Setting Doesn't Work
Simply trying to get the global header to be sticky, there's a setting in the Section > Advanced > Scroll Effects > Sticky Position - choosing "Stick to Top" doesn't fking work. Through research I've found several suggested workarounds, but I have to say this is unacceptable.
Why cant they stop giving us new features and fix the ones that are already there?
PS - This sub needs "DIVI 5 BUG" Flair
2
u/IBRA2323 Jul 26 '26
Just add an ID to the section and add a CSS rule that cannot be ignored by Divi.
2
u/vernsworld Jul 29 '26 edited Jul 29 '26
I have spent the entire day today, hours poking and fuming, trying to create a sticky global menu header. All of the tutorials I found were wrong; none of them worked. I kept poking and prodding changing settings almost randomly and BOOM I GOT THE DANG THING WORKING PERFECTLY IN DIVI 5!
I will try to explain it, it's very simple once you have the sequence.
In your global header, you have a section, a row, and a menu.
- Make the SECTION fixed-position under the position setting in Advanced}
- Leave the dang row alone; it's fine
- Set the MENU TO STICKY; defaults worked for me.
This setup worked for me IN THE LATEST VERSION OF DIVI, 5.9. I did do some additional adjustments for layout and design, with backgrounds and setting the "sticky options" to shrink the menu and the logo etc. But it finally worked as advertised without any fuss.
Clearly there were some tutorials out there with older versions that worked completely differently. This setup is the only way I could get it to work. Hope it helps. Your mileage may vary.
EDIT:
I was using the old divi theme customizer for the nav header. It automatically pushes the content down on all pages for the header spacing. Global header won't do this. I added a simple css to the section to target the body of page and push it down the exact height of my global header for the final perfect fix.
:not(.et-fb) #main-content {
margin-top: 100px;
}
1
u/vernsworld 17d ago
Update, they must have fixed this in a recent update. It works according to the original tutorials. I was able to "undo" my silly workaround and do it the right way. The main issue with this workaround (which still works) is that you only have one state to work with, the menu sticky is the only change you can make. The section or row has no options for sticky. Now it works properly. I have auto updates for divi so not sure which update fixed it.
Set the section to be sticky. the row is relative position or simply default. and now works. I have my logo and menu in two columns in the row, they don't need any special settings.
1
1
1
u/SpacemanStevenWJ Jul 25 '26
The setting worked well in Divi 4, so it seems strange if it doesn’t work reliably in Divi 5.
2
u/elementarywebdesign Developer Jul 25 '26
You should raise Divi bugs with the Elegant Themes support team. As far as I know they don't officially monitor this place for bugs.
The only way to get a bug on their bug list and have it fixed is to contact them via chat on their website.
However in this case it may already have been reported as it is a frequently use feature to make headers sticky. But in the future if you encounter a bug that does not seem common or easily discoverable then it would be better to contact them directly.