Menu Responsivity Problem

Hi! New site is almost finished. Big thanks to @Samliew for helping with the piano embed.

I am having issues with the menu. It looks great on desktop but goes haywire when I try to make it responsive. I’m not even sure where to begin. Please help!

Thanks in advance,
John Paul

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Change all flex containers to display block (X4 or 5)

Change the divs to display block (Instead of inline-block).

Flex chaos

stop using endless nested Flex containers one inside another for such simple layout (Very buggy + hard to maintain).

Example:
Use nested Flex containers for layouts like this one (column 2 This is not your case):


old ui example:

One more issue: You use a lot of styles for this simple navbar.

Thanks for your help @Siton_Systems

I literally just copy and pasted the framework from legowerks UI Kit. I don’t know why it transferred over so strangely. I am also using a template designed in 2015 so I’m unaware of how the styles were created. No time to learn everything I want to learn about styling etc. :frowning: I have to get this site up asap