Submenu from navigation goes off screen on mobile

How can i prevent my navigation submenu from going off screen on mobile? i’m using the icon stack.

screenshot of issue: https://imgur.com/a/tYw5m
site: https://tinyurl.com/y993gc33

thanks

Hi There,

Upon testing, I see that you’re using an older version of Pro theme. You need to update your theme and test this issue again.

Before updating, make sure to take a full backup of your site.

Also you can check the latest version numbers from here (https://theme.co/apex/forum/t/troubleshooting-version-compatibility/195).

Hope that helps.

I’ve updated the theme but it’s only made things worse.

The submenu is still hidden on mobile, and now the navmenu icons (which were previously hidden) are appearing, screenshot: https://imgur.com/a/x4Z30

Hi There,

Please use an em unit for your Link’s Font Size so it will be responsive.


And please turn off the Graphic option of your links if you don’t want the icon showing up.


Hope it helps,
Cheers!

“Primary Text Format” is already using em and “Graphic Setup” is already disabled.

Screenshots:


Hi there,

Instead of navigation drop-down element, please use Navigation Collapse element for mobile. That type of menu is more suitable for a smaller screen since it’s designed to expand vertically instead of horizontal.

Thanks!

Can you please tell me where I would find “Navigation Collapse element for mobile”?

Can you also please address the issue with icons in my previous 2 posts?

Thanks

Hi There,

Please see the screenshot where the navigation collapsed is highlighted in grey :

I cant see your icons on the inline menu just on mobile, if you wish to turn off you can turn off the graphics of the element.

Hope it helps

Yes, they appear on mobile, which is where most traffic comes from nowadays :wink: where do I go to “turn off the graphics of the element”? Under Appearance > Menu I can see some icons but it’s not clear how they’re removed. Is this even the right area? Here’s a screenshot: https://imgur.com/a/6FJCr

As far as the Navigation Collapsed, I see the element now… it looks like I have to add a new element from scratch to get this option i.e. I can’t change my existing menu to Navigation Collapsed - is this correct?

Hi,

  1. To turn it off see screenshot below.

  1. Yes, that’s correct, you need to add another element and make it visible only in mobile.
    For your existing menu, you need to set it to be visible only in desktop.

The visibility settings are under Customize tab

  1. I’ve done this, but the icons still show on my submenu. Screenshot: https://imgur.com/a/6Cc0L

  2. I’ll come back to this I guess. My nav menu setup is unique (for example my “Funding” and “Donation” links only appear at the smallest breakpoint when the 2 call to action buttons are hidden).

Hi There,

On your inline and mobile elements you have :

TOP LINKS and SUB-MENU you need to turn off the graphic on both places.

Let us know if you need further assistance.

Thanks

Thanks, I found the submenu area you’re referring to and have now disabled submenu icons.

I’ll report back when I get to mobile navigation dropdown issue.

Great, Thank you.

I had one of my developers remove the current menu and rebuild using the inline Nav. Thanks

Thanks for letting us kno!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.