UPDATE: Since the Divi 4.0 update (that was released in October 2019), there are now much more possibilities for building custom headers with Divi. You can find out more about these new options in my other article about designing custom header for Divi.

If you ever run into any problem with the default Divi menu bar gray line and wanted to remove it, I will explain in this article how you can do it. I mean the gray line that separates the header (that contains the logo and your menu links) and the main content part of your Divi website.

In my case, I was working on one client’s website and we had both the header with white background and the main content section below the header with white background as well. And we didn’t like the gray line below the navigation bar, so I simply removed it.

So, if you need to remove this line, just add the following custom CSS code to your Divi Theme Options Custom CSS field:

#main-header { box-shadow: none !important; }

And if you want to remove the shadow bottom the menu bar, too, just add this code, too:

#main-header.et-fixed-header { box-shadow: none !important; }

And that’s all for today’s quick tutorial.

Feel free to subscribe to my newsletter to be notified of more Divi quick tips like this one.