How to Remove the Gray Line Below Menu Bar on 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 for more Divi quick tips.

WordPress expert. Divi user since 2014. I blog about WordPress and Divi, my favorite WordPress theme. When I’m not working with WordPress or writing an article for this blog, I’m probably learning Italian. You can read more about me here.
Thanks! Looks so much cleaner now.
Thanks a lot! :-)
how to make this work but only on mobile version ?
Try the following code:
@media only screen and (max-width: 600px) {
#main-header { box-shadow: none !important; }
}
Thank you!