Page menu disappears at the lowest resolution
Author: John R.
Visited 2042,
Followers 1,
Shared 0
Hello.
How can I stop the page menu from disappearing at 480px please? If you rotate the mobile to landscape it appears. Putting it in portrait mode it disappears. I would like all content to show in portrait mode.
Is this possible to achieve please?
Many thanks.
John
Posted on the
John, I'm pretty sure this works even for v16 users.
Add a new resolution of 320px
You'll have to revisit layout for headers, footers, etc to make sure things fit at that reolution, but the upshot is the lowest resolution 99.5% of users will see is 480px on their mobiles. I have yet to come across a 320px phone.
Your menus designed for 320px-480px will not revert to toaster bars.
Author
Thanks for that but it left the space for it but the page menu was not showing until I rotated my mobile.
Any further help would be appreciated.
Thank you.
Hello.If your menu has several short names for menu items, they can be seen on small screens.But if the menu is large, then it may not fit on the screen.You can try to enlarge the area of the menu object on small screens.
Also keep in mind that 100 pixels on the screen of a 24-inch monitor and 100 pixels on the screen of a 6-inch mobile device are different 100 pixels. Even if these screens have the same resolution. Perhaps you should read this and see this.
Author
Thanks for that. I would have thought that part of the menu should show but it doesn't. The website in question is https://theatremusicshop.com
Look at https://theatremusicshop.com/showtimemusic.html for example on a mobile if you don't mind and you should see the problem.
Thanks again.
John, as Aleksej said, if you reduce the length of menu items you can fit more on one line (perhaps you could drop the word Albums from all pages? Then you could make each button narrower)
However, there is no requirement to have a single line for each menu, by dragging the object deeper, you can have multiple lines (even back in v16). This also applies to the Sticky Bar
Please see attached (import the project and check every resolution)
"Look at https://theatremusicshop.com/showtimemusic.html for example on a mobile if you don't mind and you should see the problem." - I see a mobile menu:
Here's some info and a handy reference chart for screen size vs port size. I still like to push the preview down to 360 just to be sure all looks ok.
https://mediag.com/blog/popular-screen-resolutions-designing-for-all/