Testing the jumping header fixes

The tutorial from SJ James (originally posted way back in September 2015!) popped up number 1 in Google for “fix Divi jumping header” so this was the 1st fix I tried (and from memory was the one I implemented years ago). SJ has been in the Divi community for a long time and knows his stuff, so this was a good start. Unfortunately this didn’t work, so it was back to google. The next few were results were just copies of SJ’s original post, so I skipped those and went to a tutorial from Web Limited.

The fix that worked for me was…

The tutorial from tutorial from Web Limitless fixed my jumping header! However, in the tutorial it says that the main header and page-container height numbers should be the same, but for me they were not. I assume this is because i have the secondary menu active which adds to the overall height, so I just used the value of the padding-top on the page-container, which for me was 82px.

Step 1 – Inspect element to find header heights

You will need to use the inspect element tool (right click > inspect element) to find the specific heights needed to work with your site as seen below. Look for the line that start div is=”page-container”…

and then you need the value for padding-top.