The position property selects the element's positioning scheme — whether it stays in normal flow or is taken out and placed relative to a container/position. Also determines how top/right/bottom/left apply..pill {
position: absolute;
}.sticky-header {
position: sticky;
top: 0;
z-index: 10;
}staticDefault. The element is in normal flow; top/right/bottom/left/z-index have no effect.relativeElement stays in flow but is visually offset from its original position. Often used as a containing block for absolute children.absoluteElement is removed from flow and placed relative to the nearest positioned ancestor. Does not occupy flow space.fixedElement is removed from flow and fixed relative to the viewport. Does not move while scrolling.stickyHybrid — element flows normally until it crosses a scroll threshold, then behaves like fixed until its container leaves the viewport.CSS Positioned Layout Module Level 3Editor's DraftW3CMDN
CSS
Show all codeEdit CSS onlineThe plugin that remembers hundreds of CSS items for youEvery CSS property — in a live demonstrationThe bilingual CSS referencedefinitionexamplessyntaxmodulespecificationsourcesvisual demonstrationpreviousnext
