CSS Position Property

Interactive Demo

What is Position?

The position property in CSS determines how an element is positioned within the document. It allows you to place elements relative to their normal position, their parent, the viewport, or other reference points. Common values like static, relative, absolute, and fixed help create advanced layouts and interactive designs.

Position Types

Visual Example: Static

Static positioned box

CSS Code

.static-element {
  position: static;
  background: #3b82f6;
}

Key Points

Default behavior for all elements
Elements appear in normal document flow
Cannot be offset with top/left/right/bottom