CSS Position: Sticky

Stick elements to the top when scrolling
Martin Rabensteiner - 2026-08-31

With position: sticky, an element keeps the same position, unless the page is scrolled and it would disappear. Then it stuck to the top, similar to position: fixed.

This is especially convenient for multi-layer menus, where e.g. the second (context) layer should stick to the top when scrolled down.

References

MDN Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/position (with example)