CSS overflow-anchor Property

Definition and Usage

The overflow-anchor property controls scroll anchoring. When content above the visible area grows or shrinks, the browser can adjust the scroll offset so the text you were reading stays put instead of jumping.

The initial value is auto, and anchoring is on by default where supported. You usually set this property only to opt out with none on a document, a scroll container, or a specific element that should not be chosen as an anchor. It is not the same as overflow, which controls clipping and scrollbars.

CSS Syntax

Property Values

How to Use overflow-anchor

Leave the default alone unless anchoring causes a problem, then opt out where needed.

1. Build a scrollable area with overflow set to auto or scroll, or use the page scroll.
2. Keep overflow-anchor: auto (the default) so the browser can stabilize scroll when content above changes.
3. If a jump still feels wrong, set overflow-anchor: none on the changing element, the scroll container, or (rarely) the whole document.
4. Test with real inserts: ads, lazy images, comments, and chat messages above the fold.

Live Preview

Scroll halfway down, then insert a block above. With auto, supported browsers try to keep your reading spot. With none, the view can jump.

CSS Examples

Each snippet focuses on overflow-anchor. Use Try It Yourself for a live editor with a small insert button.

<style>
  .feed {
    height: 120px;
    overflow: auto;
    overflow-anchor: auto;
    border: 1px solid #cbd5e1;
  }
</style>

<div class="feed">
  <p>Older item</p>
  <p>Reading here</p>
</div>

<style>
  .feed {
    height: 120px;
    overflow: auto;
    overflow-anchor: none;
    border: 1px solid #cbd5e1;
  }
</style>

<div class="feed">
  <p>Older item</p>
  <p>Reading here</p>
</div>

<style>
  .feed {
    height: 120px;
    overflow: auto;
    border: 1px solid #cbd5e1;
  }
  .banner {
    overflow-anchor: none;
  }
</style>

<div class="feed">
  <div class="banner">Promo banner</div>
  <p>Reading here</p>
</div>

Key Takeaways