Разделить меню заголовка WordPress Bootstrap Navwalker на две строки только на небольших экранах ⇐ Php

[Anonymous]

This WordPress website uses Bootstrap 4 and a version of Navwalker.

My client only views her website from her iPhone, and she doesn't want the menu to collapse. So, for her to see the entire menu links, I've had to make the fonts smaller, and she doesn't like that.

Now I am thinking if I could split the menu to be in two lines or at least have the links spill over into the next line when the screen is less than 450px, that would work for her.

Is there a way to do that with bootstrap/navwalker/wordpress?

Here is the header.php code for the navigation section:

And here is the resulting code as seen from view page source - for the navigation php section:

• Home
• Artwork
• Creative Director
• Background
• Contact Us

Note: None of the menu items have a drop-down submenu.

I guess one option would be to create two separate menus, and have them display just under each other, but I am actually not sure how to do that.

The best solution would be to somehow get the one menu to automatically split into a second row if the full menu list can't be displayed in the available width on smaller screens. (Keep in mind, she doesn't want the menu to collapse into the menu icon as per normal on smaller screens!)

Can anyone suggest how I can accomplish two lines of menu on a smaller screen?

Thanks for any advice.

SunnyOz


Источник: https://stackoverflow.com/questions/781 ... ller-scree