[Resolved] mobile menu stuck and does not scroll

[Al]

Hi,
The mobile menu slide in get’s stuck to whatever phone scree size and does not scroll down.
Here is an example:
From a phone, I click on the menu button.
The menu slides in.
I click on the arrow to open the any sub menu.
at this point I can not scroll down to see the rest of the menu.
From a smaller phone, I can’t even get to the last 2 items on the menu.
I tried to expand the mobile break point but that didn’t have any effect. Also the menu item hight did not effect it unless we make it super small, which is not what we want.
How can we fix this?
Thank you.

[David]

Hi there,

try adding this CSS:

.mobile-header-sticky #mobile-header.toggled .main-nav>ul {
    max-height: calc(100vh - 74px);
    overflow-y: scroll;
}

The alternative is to enable the Off Canvas Panel for Mobile:

https://docs.generatepress.com/article/off-canvas-panel-overview/

[Al]

Thank you David, I went with the Off Canvas Panel for Mobile option because it’s more flexible and customizable.
Thank you again.

[David]

You’re welcome

[Author]

Posts