Mobile Menu on a Larger screen size

Question

Hi,

Due to the number of main items I have in my menu structure and the fact that I don't want to create drop down menus from these main items, I'd like to have the "mobile menu" displayed until I reach a screen size of 1230px. Once I reach the 1230px screen size I can display the normal full size menu in place of the mobile menu.

I am trying to do this without modifying the responsive.css file so I can continue to upgrade versions. I do have a custom.css file already in use, but can't seem to make this work. Hoping you can help.

SemiColonWeb · Accepted Answer

Hello,

Unfortunately, this is currently the only way you can display the Mobile Menus on Desktop Devices, by editing the css/responsive.css File and moving all the #header, #logo and #primary-menu Related CSS Code Blocks from the @media (max-width: 991.98px) Media Query to the @media (max-width: 1199.98px) Media Query. You can tweak it according to your requirements so that it best fits the available width. There is no simpler solution for this at the moment but we are continuously working on making this easily moveable and will release an Update once this is available to be used.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Only1BruceC · Answer

Well, not exactly what I wanted to hear, but I did it and it works THANKS!

Semicolon Web · Answer

Hello,

Apologies about the Inconveniences. Unfortunately, that is the only solution currently available. As we mentioned, we will definitely try making this easier with the future updates.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.