I'm coding my first WordPress Theme and trying to solve this problem:
On the desktop version of the website I’d like to split the menu into 2 sections. One would appear on the left of the logo and the other on the right of my logo (the logo is centered). The only way I know how to do this is to create 2 separate MENU objects in WP and then with CSS position each one accordingly.
This however causes a problem when I want to convert the menu into a mobile-friendly drop-down menu, because in the approach shown above I end up with 2 separate lists of menu items (Left and Right) and I don’t know how would I merge them into one list for mobile-friendly drop-down menu.
I understand I can write custom CSS to add margin between menu item #2 and item #3, for example. But since I’m writing a theme this approach won't work, as it requires to know upfront how many menu items will be present. I need it to be something that would work regardless of the number of menu items and that would allow people to re-arrange menu items using WP Menu UI.
Is this the wrong way to tackle this? If you could suggest how to approach this better I’d be very appreciative.