I am having the same issue and have tried changing overflow options on all other elements around the navbar with no luck. I’ve actutally continuously had this issue with several sites now.
I believe it’s a bug within the css not registering overflows on different z-indexes.
It has not to do with nested additional divs.
After spending 4 hours determined to fix this… I found that simply navbar was tagged with “fixed”. I did this in attempt to keep the navbar stuck on the top of the page; Yet this also keeps the mobile Navbar menu as “fixed” in scroll regardless of specificity. Since it is nested inside the fixed Navbar it seems to ignore any scroll attributes nested inside.
Although not always ideal… changing the navbar to a “relative” position (keeps only on top of page, but will allow scrolling), this will cause other minor bugs to fix. As a solution i created an additional navbar as:
- Make sure overflow is set to visible on all elements nested inside the navbar (original).
- Clone the original Navbar.
- Duplicate all the needed styles you’ll need (and alter their name(s) so theirs no future bugs).
- Changed the secondary navbar to “fixed” with a smaller menu (that won’t need to scroll).
- On a z-index lower than the first section of the page (and initial navbar).
- Duplicate any custom interactions with new name, and tagging only the new navbar (if yours was also customized)
So once you scroll below the first section, the limited “fixed” navbar shows, While the top of the body that contains a larger navbar that is completely scrollable.
Hope this helps others.