Mobile Mega Menu (GB) cuts off content

  • Jokermanu
    May 21, 2026 at 5:02 am

    Hi support team,
    I built a Mega Menu using GenerateBlocks for a client. Everything works perfectly on desktop, but there are major issues with the scrollability of the submenu on mobile devices.
    The Issue:

    1. When the page is not scrolled (at the top): The submenu opens, but it is quite long. It is impossible to scroll down to the end of the navigation (content gets cut off).
    2. When the page is already scrolled: If you open the menu after scrolling down the page, it either shows only the first two items or no content at all inside the overlay.

    I have tested both “Partial Overlay” (preferred) and “Full Overlay” – the behavior remains almost the same.

    Could you please let me know which settings or CSS fixes are required to make the mobile overlay scrollable within itself?

    More information in “private information”

    Thanks in advance and best regards.

  • Ying
    May 21, 2026 at 8:19 am

    Hi there，

    You have this custom CSS, the fixed position is causing the issue, try removing it.

    @media (max-width: 1024px) {
    .gb-menu-container--mobile .gb-overlay--anchored {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100dvh !important;
        max-width: 100% !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
}
  • Jokermanu
    May 26, 2026 at 1:55 am

    Hi Ying,

    thank you for the quick reply and sorry for my late response.

    Thank you also for the note about the custom CSS. I have removed the CSS but unfortunately that does not seem to have been the error. Now it is still the case that on the smartphone only the first two navigation entries appear when scrolled. And it is possible in this small area to scroll to see all entries.
    If not scrolled yet and a submenu is opened, it is no longer possible to scroll down to the bottom of the Navi / Overlay.

    I hope you understand what I mean. I have also included a link to a screen video in “Private informations”.

    Best reagards,
    Manuel

  • George
    May 26, 2026 at 5:35 am

    Hello,

    It seems to be working fine on my phone. Did you try clearing the cache, if you have any? Also we are not able to check your CSS or your mega menus from the backend since we don’t have the right user permissions.

  • Jokermanu
    May 26, 2026 at 5:46 am

    Hi George

    Did you try clearing the cache, if you have any?

    Yes, I have done that several times before, unfortunately without success.

    Also we are not able to check your CSS or your mega menus from the backend since we don’t have the right user permissions.

    Sorry about that, I have changed it.

  • Ying
    May 26, 2026 at 8:06 am

    You set the height of the mobile menu container to 100vh, I’ve changed it tocalc(100vh - var(--gb-menu-offset, 0)), and set overflow-y to scroll.

    Can you flush the cache and see if that works?

  • Jokermanu
    May 26, 2026 at 9:50 pm

    Yes! It’s working now. Thanks a lot for your help!

  • Ying
    May 27, 2026 at 8:08 am

    You are welcome   🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.