CSS Positioning
The position property controls how an element is placed in the document. It works with top, right, bottom, and left offset properties.
The five position values are: static, relative, absolute, fixed, and sticky.
CSS
Beginner
3 min read
Introduction to CSS Positioning
Example
.static { position: static; } /* default */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.sticky { position: sticky; }
/* Offsets only work on non-static elements */
.box {
position: relative;
top: 20px; /* Move down 20px from normal position */
left: 10px; /* Move right 10px */
} Pro Tip
Offsets (top, left, right, bottom) have no effect on position: static elements — the default.