How to Widen the Drop-down Menu in the Divi Theme

by Last Updated: Jun 2, 2023Blog, Divi theme

Recently, when I was creating a website for a client with the Divi theme, I ran into the following problem: That particular website had quite a lot of menu items (pages) and some of them had long titles (some had 3-4 words). And this caused that these titles were stacked into 3-4 lines (just for one menu item).

 

Make Divi Drop-down Menu Wider

 

To fix this, I applied the following custom CSS code to increase the width of the sub-menu items:

@media screen and (min-width: 981px) {
.sub-menu {
min-width: 380px;
}

#top-menu li li a {
width: 350px;
padding: 6px 10px;
}
}

This solved the issue.

The first part of the code assures that on desktop devices (that are at least 981px wide), the minimum width of the sub-menu drop-down boxes will be 380 pixels.

The second part of the code is additional – it sets the padding around the sub-menu texts. Feel free to remove it, as you may not need it.

Also, you can play around with the numbers and adjust their values in this code to suit your needs.

If you are new to Divi and do not know where to insert this code, I will explain it to you right now. Just copy & paste this code into Divi > Theme Options > Custom CSS (in your WordPress admin panel). Or, alternatively, if you are using a child theme, insert this code into the style.css file of your child theme.

And that is it. Feel free to subscribe to my newsletter if you want to be notified of my future Divi tips like this one.

Finally, you might also like to check out my other Divi header tutorials: One is on how to create a custom header and the other is on how not to shrink the header when scrolling (this is a Divi-specific feature).

5 Free WordPress Plugins You Should Use

Banner - Author Box for Divi Plugin

Andrej

Author: Andrej

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.