Disable horizontal scroll - animation not working

Hey guys, does anyone know how to disable horizontal scroll and keep Body While the page is scrolling animation active? For previous projects, I’ve used

html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

But this completely disables my Body While the page is scrolling animation. Any ideas? :neutral_face: The animation is about a sticky nav menu (resizing its height).

Unfortunately cannot share my Read-Only link; the project is under NDA.

Maybe this can help:

https://webflow.com/website/Shrinking-Nav-on-Scroll

I am pretty sure that this solution would work. But in my project, I don’t want the menu to be resized on every scroll up. That’s the reason why I’ve used While the page is scrolling animation.

0-5% - menu height 120px
5-100% - menu height 90px

but unfortunately this code

html, body { max-width: 100% !important; overflow-x: hidden !important; }

disables my Body While the page is scrolling animation entirely. I still don’t understand the reason, and I can’t find a workaround.

The reason that the body doesn’t scroll is because in that code (overflow-x: hidden !important) is telling the body to only show what’s in the viewport and everything else won’t show or in this case scroll.

What I would do is to insert the navigation bar into a div block and apply that overflow:hidden (which you can do inside the designer, no need for custom code) to only that div instead of the whole body.