Help: Cannot scroll on container which has `overflow-y-auto`.

[sagarkhadka]

Hello 👋

In my next js project I am using shadchUI with tailwind and this version of locomotive-scroll "locomotive-scroll": "^5.0.0-beta.8",. When I am using AlertDialog which has max-height of 90vh and has overflow-y-auto, then the container is not scrollable. It doesn't have to be AlertDialog, even on simple regular div having overflow content it is not scrolling.

Thank you 👊

[sagarkhadka]

Did some digging in Lenis github repo and they suggested to add following in css

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

and use data-lenis-prevent in the container where overflow is on scroll and all works good. Thank you 👊

[devenini]

Awesome! Indeed, using data-lenis-prevent is the solution when you have control over the HTML elements. However, there are cases where you might come across third-party injected modals that don't allow adding data-lenis-prevent attributes. For that scenario, we've provided a workaround in our documentation.