CSS overflow-anchor property
- Previous Page overflow
- Next Page overflow-wrap
Definition and Usage
overflow-anchor
This property is used to turn off scroll anchoring (scroll anchoring).
Scroll anchoring is a feature of the browser used to prevent the area that has already been scrolled into the viewport from moving when new content is loaded. This is often a problem when the network connection is slow, that is, when the user scrolls down and starts reading before the page is fully loaded.
Example
Turn off scroll anchoring:
div { overflow-anchor: none; }
CSS Syntax
overflow-anchor: auto|none|initial|inherit;
Property Value
Value | Description |
---|---|
auto | Default Value. Enable scroll anchoring. |
none | Disable Scroll Anchoring. |
initial | Sets this property to its default value. See initial. |
inherit | Inherits this property from its parent element. See inherit. |
Technical Details
Default Value: | auto |
---|---|
Inheritance: | No |
Animation Production: | Not supported. See:Animation-related properties. |
Version: | CSS3 |
JavaScript Syntax: | object.style.overflowAnchor="none" |
Browser Support
The numbers in the table represent the browser version that first fully supports this property.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
56.0 | 79.0 | 66.0 | Not Supported | 43.0 |
Related Pages
Tutorial:CSS Overflow
Reference:CSS overflow property
- Previous Page overflow
- Next Page overflow-wrap