Overscroll Behavior does not work if contents do not overflow?
Asked Answered
F

0

7

Is there any way to prevent scroll-chaining, i.e. prevent the body from scrolling, by using a <div /> with overflow: scroll and overscroll-behavior: contain, without having contents that overflow said div?

It seems that it only works when the inner contents do in fact overflow the parent div. Does anyone know any workaround?

This chromium ticket seems to describe the same problem: https://bugs.chromium.org/p/chromium/issues/detail?id=813094

I expected overscroll-behavior: contain to prevent scroll-chaining (the body from scrolling) even without having child contents within it that overflow.

I have made a Codepen here to visualize the issue: https://codepen.io/benjamindenboer/pen/RwEodWJ

Falito answered 6/9, 2023 at 16:25 Comment(1)
Check this out. codepen.io/kunwar-saroj/pen/eYbgOjOGerontocracy

© 2022 - 2025 — McMap. All rights reserved.