Sub menu width

I have a sub menu here under offers>coaching and consulting and I want to make this section of the sub menu wide enough to have the title on one line instead of break into two lines. I have added the following code but it seems not to work? It works in inpector but even then the sections are not equal and looking wrong.

http://www.womenoffaithwhothrive.com

.megamenu-child-container > ul.sub-menu > li { width: 244px !important; } .megamenu-child-container > ul.sub-menu { width: 830px; }

Hope you can help.

Hi hantaah, 244px is not enough… in my browser it’s 266px anyway. Then the title is in one line, but since you’ve set a fixed width to the .megamenu-child-container, the next li element gets wrapped into the next line, and there remains a margin to the right, which makes them appear looking unequal.

Maybe a width:auto would be better?

e.g.

.megamenu-child-container > ul.sub-menu > li {
    width: auto !important;
}
1 Like

Thanks everyone!

@PaulOB you were spot on and got the desired result.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.