CSS Reference
CSS Reference CSS Selectors CSS Reference Aural CSS Web Safe Fonts CSS Units CSS Colors CSS Color Values CSS Color Names CSS Color HEX CSS3 Browser SupportCSS Properties
CSS position Property
Example
Position an <h2> element:
h2
{
position:absolute;
left:100px;
top:150px;
}
{
position:absolute;
left:100px;
top:150px;
}
Try it yourself »
More examples at the bottom of this page.
Definition and Usage
The position property specifies the type of positioning method used for an element (static, relative, absolute or fixed).
| Default value: | static |
|---|---|
| Inherited: | no |
| Version: | CSS2 |
| JavaScript syntax: | object.style.position="absolute" |
Browser Support
The position property is supported in all major browsers.
Note: The value "inherit" is not supported in IE7 and earlier. IE8 requires a !DOCTYPE. IE9 supports "inherit".
Property Values
| Value | Description | Play it |
|---|---|---|
| static | Default. Elements render in order, as they appear in the document flow | Play it » |
| absolute | The element is positioned relative to its first positioned (not static) ancestor element | Play it » |
| fixed | The element is positioned relative to the browser window | Play it » |
| relative | The element is positioned relative to its normal position, so "left:20" adds 20 pixels to the element's LEFT position | Play it » |
| inherit | The value of the position property is inherited from the parent element |
Try it Yourself - Examples
Position:relative
This example demonstrates how to position an element relative to its normal position.
Related Pages
CSS tutorial: CSS Positioning
HTML DOM reference: position property
Your suggestion:
Close [X]
Thank You For Helping Us!
Your message has been sent to W3Schools.
Close [X]
