overscroll-behavior in CSS

The overscroll-behavior CSS property controls what happens when you reach the boundary of a scrollable area. It's useful for managing scroll chaining and preventing unwanted browser behaviors like the "bounce" effect or "pull to refresh."

Usage

• Default (auto): Normal scroll behavior.
• Contain: Stops scroll chaining; keeps default behavior within the element.
• None: Prevents both scroll chaining and the default overflow behavior.

Examples Prevent underlying content from scrolling:

.scroll-container { height: 220px; overflow: auto; overscroll-behavior-y: contain; }

Disable overscroll effects:

html { margin: 0; overscroll-behavior: none; }

#css #alignment-issue #frontend