CSS Positioning
Element is positioned relative to its normal position. Offsets move it without affecting other elements' layout.
Position
Offsets
top0px
left0px
right0px
bottom0px
Options
relativeElement is positioned relative to its normal position. Offsets move it without affecting other elements' layout.
/* Target Element */
.target {
position: relative;
}
Ancestor Container (position: relative)
Original Position
target
relative
Target Element
Original Position
Ancestor Container
Quick Reference
| Position | Removed from Flow | Reference Point | Scroll Behavior |
|---|---|---|---|
| static | No | — | Scrolls normally |
| relative | No | Itself (normal position) | Scrolls normally |
| absolute | Yes | Nearest positioned ancestor | Scrolls normally |
| fixed | Yes | Viewport | Fixed to viewport |
| sticky | No | Scroll container threshold | Sticks on scroll |