Positioning

Place elements with relative, absolute, fixed, and sticky

Position controls how an element is placed. The reference point changes depending on the value.

Position

Default flow. Offsets have no effect. Element sits in normal document order.

Legend

Viewport

Parent (position: relative)

Sibling elements

Target element

viewport

grandparent (static)

parent (relative)

Sibling A

Target

Sibling B

Tailwind CSS

<div class="static">
  Target <!-- normal flow -->
</div>

10 / 23