Build websites in Divi on WordPress and want to fix the jumping header? I have a solution for you! If you notice your page content jumping when you refresh or load a page, it could be because of your navigation. Using the default header in Divi may be causing your issues. Learn how to solve the issue utilizing the Divi Theme Builder.
If you implement a header using the theme builder, and you decide to position the header as fixed, the first sections of your page content will be affected. If you need to make adjustments, you can target the classes below.
PLEASE NOTE! The number of pixels will differ for everyone based on the size you build your header. Make sure you adjust those numbers to work for you. The code snippet below are only an example for you to embellish upon.
MARGIN ADJUSTMENT FOR PAGE CONTENT
.et_pb_section_0.et_pb_section {margin-top:100px !important;}
@media only screen and (max-width: 981px) {
.et_pb_section_0.et_pb_section {margin-top:50px !important;}
}MARGIN ADJUSTMENT FOR BLOG CONTENT
.et_pb_post_content_0_tb_body {margin-top:-90px !important;}Resources
Here are links to the programs and sites I mentioned in the video.
Divi: https://bit.ly/3mun7TN
WordPress: https://wordpress.org/
Want to learn with me?
Check out my digital course, Recipe For A Sales Page on Udemy. This course features my recipe for a sales or landing page and identifies all the ingredients you need to make a compelling page that will capture your reader’s attention and turn them into paying customers.
Disclosure: Some of the links in this post are “affiliate links.” This means if you click on the link and purchase the item, I will receive an affiliate commission.
