CSS positionProperty

Example

Positioning the <h2> element:

h2 { position:absolute; left:100px; top:150px; }

Try it Yourself »

More examples at the bottom of this page.

The position property specifies the type of positioning method for an element (static, relative, absolute, or fixed).

Default value:	static
Inherited:	no
version:	CSS2
JavaScript Syntax:	object.style.position="absolute"

The numbers in the table indicate the first browser version number that supports the property.

Property
position	1.0	7.0	1.0	1.0	4.0

Value	Description
absolute	Generates an absolutely positioned element, positioned relative to the first parent element other than static positioning. The position of an element is specified by the "left", "top", "right", and "bottom" properties.
fixed	Generates a fixed positioned element, positioned relative to the browser window. The position of an element is specified by the "left", "top", "right", and "bottom" properties.
relative	Generates a relatively positioned element, positioned relative to its normal position. Therefore, "left:20" will add 20 pixels to the LEFT position of the element.
static	Default value. No positioning, the element appears in the normal flow (ignores top, bottom, left, right, or z-index declarations).
sticky	Sticky positioning, which is based on the user's scroll position. It behaves like position:relative; and when the page scrolls beyond the target area, it behaves like position:fixed; it will become fixed at the target position. Note:Internet Explorer, Edge 15, and earlier IE versions do not support sticky positioning. Safari requires the -webkit- prefix (see the example below).
inherit	Specifies that the value of the position property should be inherited from the parent element.
initial	Set this property to its default value. See detailsCSS initial keyword。

Position:relative
This example demonstrates how an element is positioned relative to its normal position.

CSS Tutorial:CSS Position

other extensions