• Home
  • About Us
  • Digital Marketing Terms
  • Local SEO Services
  • SEO Consulting
  • WordPress Speed
  • Contact Us
  • Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Yooter

WordPress Tutorials, Local SEO Consulting

  • WordPress General
  • WP Troubleshooting
  • Divi Builder
  • WordPress Plugins
  • Local SEO
  • Show Search
Hide Search
You are here: Home / Divi Builder Troubleshooting / How to Fix The Jumping Header Issue Divi Builder

How to Fix The Jumping Header Issue Divi Builder

Aaron James · July 19, 2020 · Leave a Comment

This has been an issue with Divi Builder ever since I can remember. On page-load, you may notice the jumping header issue caused by a few code inconsistencies. For the record, I use the Divi Builder for just about every website I build. The jumping header issue is only a small snafu that can be easily corrected.

The real issue is caused by the style sheet loading first, and then the inline CSS is applied shortly after. The delay in the loading time creates the jump illusion.

Here is a quick tutorial on how to fix the jumping header issue in the Divi Builder:

1. Use an inspector software or the Firebox Developer tools inspector to locate the following items within the Divi page elements. See image below.

Divi Builder Jumping Header Issue

2. Add the following CSS code under Customize >> CSS to match the #page-container: style=”padding-top:152px;” and #main-header: style=”top:50px;”.


#main-header {
top: 50px !important;
}
#page-container {
padding-top: 152px !important;
}

It is important to note that the values will be different for your website, and you need to change them to match. If the issue persists with the Divi header jumping, try adding a fade animation to the entire header. You may have another type of loading issue that can be eliminated by adding an animation.

Filed Under: Divi Builder Troubleshooting

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Recent Posts

  • How To Get More Followers On Instagram 2021
  • How To Use Google Reverse Image Search
  • What is ADA Compliance for Websites?
  • How To Install Google Analytics 4 In 7 Easy Steps
  • Can’t Change The WordPress Admin Email Address
  • The Importance of SEO
  • Outdoor Quarantine Activities For Your Team
  • Digital Marketing Terms and Glossary
  • When Is The Best Time To Post On Instagram 2021
  • 5 Digital Marketing Quarantine Activities During The Pandemic

Featured Service

local seo services

Local SEO Services

With more than 15 years of search engine marketing  experience, Yooter is a local SEO services company that strategically optimizes websites for small to medium-sized businesses. Local SEO services … Learn More about Local SEO Services

Archives

  • December 2020
  • November 2020
  • October 2020
  • September 2020
  • August 2020
  • July 2020
  • March 2020
  • November 2019
  • October 2019
  • September 2019
  • May 2019

Categories

  • Digital Marketing
  • Digital Marketing During Covid-19
  • Digital Technology
  • Divi Builder Resources
  • Divi Builder Troubleshooting
  • Gravity Forms
  • Gravity Forms Snippets
  • Local SEO
  • Social Media Marketing
  • Social Media Trends 2021
  • Uncategorized
  • WooCommerce Snippets
  • WordPress Code
  • WordPress Experts
  • WordPress Plugins
  • WordPress Technology
  • WordPress Themes
  • WordPress Troubleshooting

Specialty Areas

  • SEO Experts
  • Lehigh Valley Web Design
  • Philadelphia SEO Services
  • SEO Audit Services
  • Ad Agency Reviews
  • PPC Management Agency
  • What Is Social Media Marketing?

Copyright © 2021 · Yooter - A Search Engine Marketing Agency