Skip to content
Layout

position

Controls how an element is positioned relative to normal document flow and its containing block.

4,582 effects in the catalog use this property.

Syntax

position: static | relative | absolute | fixed | sticky;

Watch out

If `sticky` appears not to work, inspect ancestors for `overflow: hidden` or another scrolling value; the sticky element is constrained by that scrolling box.

Common values

relative
Keeps its place, accepts offsets, and anchors positioned descendants
absolute
Leaves normal flow and positions against the nearest positioned ancestor
sticky
Scrolls until a threshold, then sticks

Effects using position

These are working effects from the catalog. Open a tile to inspect the full source.