position

The position property designates which type of method is used for positioning an element.

Syntax

Example:

div.ex {
  left: 50px;
  position: absolute;
  top: 100px;
}

Values

static
Default value. Elements render in the same order as they appear in the document flow.

absolute
The element is positioned relative to its first positioned ancestor (not static).

fixed
The element is positioned relative to the browser window.

relative
The element is positioned relative to its own normal position.

sticky
The element is positioned based on the scroll position of the user. The element is positioned relative until it reaches a given offset position in the viewport, at which point it sticks in place like position: fixed.

initial
Sets the property to its default value.

inherit
Inherits this property’s value from its parent item.

Browser Compatibilty

Demos

Have a code example of position? Submit a codepen.io demo and we'll showcase it here ↴