Main/Top Navigation - Break to Hamburger only at Mobile Width

Web part name (as shown in web part properties) to which you’re suggesting an enhancement
Main Navigation
What is current web part behavior (or look) that doesn’t work for you?
When using long navigation names or 5+ top navigation items, the navigation bar breaks to a hamburger icon even at normal desktop widths), hiding the navigation bar from desktop users
> Have a screenshot (please do not include confidential info in your screenshots)?


What would you like the web part behavior (or look) to be?
Ideally, we would be able to toggle the navigation to break to two + lines, or decide what width to break to the hamburger menu (ie, “only show hamburger on mobile” or similar toggle). This can currently be almost done by applying “flex-wrap:wrap” to the .navContainer class, but the scripted break to the hamburger overrides this
> Have a sketch or a mockup?

What is the scenario for which you need the suggested new look/behavior?

Displaying longer/larger navigation for global nav without hiding it behind a hamburger/click for desktop users.

1 Like

Thank you for your suggestion! We’ll look at this option on our end to make sure there are not side effects and post an update here.

Congrats! This is now implemented, please contact support for an upgrade.