[Resolved] Do not allow menu to break into two lines with only a single item on the second

[Tom]

I’m not sure the best way to phrase this, but what I want to fix is that when my menu breaks to a second line I want it to break so that last two items go to the second line and not just one. So what I’m trying to say is that the last two menu items stick together and both wrap. it looks weird when it breaks and there is just one menu item on the second line because the last menu item is styled as a button.

[Fernando]

Hi Tom,

You can try adding this through Appearance > Customize > Additional CSS:

@media(min-width: 1357px) and (max-width: 1455px) {
    div#primary-menu ul#menu-main-menu {
        width: 80%
    }
}

@media (min-width: 1213px) and (max-width: 1356px) {
    div#primary-menu ul#menu-main-menu {
        width: 90%
    }
}

@media(max-width: 1213px) {
    div#primary-menu ul#menu-main-menu {
        width: 100%
    }
}

[Tom]

That worked great – thank you!

[Tom]

Marked Resolved

[Tom]

[Fernando]

You’re welcome, Tom!

[Author]

Posts