Mobile menu scrolling

Design help General
1

Hi all,

I’ve found a frustrating little bug in a website I built and launched.

Plain and simple: the mobile menu extends beyond the viewport once multiple dropdowns are open and you cant scroll to see them; the site just scrolls behind the menu.

I’ve read through multiple forum topics on this and have tried every combination of the solutions (most of which involved setting overflows to “scroll” or “auto”) and nothing seems to help.

It’s probably something simple I’m missing, but I’m at a loss. Any help would be appreciated.

Thanks!

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

2

Hi there,

Mobile dropdown overflow issues can be frustrating, but there are several effective solutions to ensure your dropdowns display correctly:

Setting ‘Overflow: hidden’ on your menu container will prevent content from spilling outside its boundaries. Additionally, configure your dropdown elements to use percentage-based widths (100% or less) rather than fixed widths to ensure they stay within the mobile viewport.

For precise troubleshooting, enable X-ray mode in your Canvas settings to identify which specific elements are causing the overflow. This will help you target and adjust the problematic components directly.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

3

Hey @rmounts ,

Can you try adding the following code in the ‘Inside head tag’ custom code section of the homepage (or any page) and check if it works as per your requirement on the published site?

<style>
  @media screen and (max-width: 991px) {
    .navbar-menu {    
      height: 100vh !important;
    }
  }
</style>

If it works, you can consider having this in the head section of site wide code. Hope this helps.

4

Set your mobile menu wrapper to position: fixed; height: 100vh; overflow-y: auto; so it scrolls independently of the page. Had to fix this on a client nav where multiple dropdowns stacked past the viewport.

1 Like
5

This worked! Thank you!

1 Like