The CSS position property
Positioning the elements:
{
position:absolute;
left:100px;
top:150px;
}
Try it out . . .
There are more examples at the bottom of this page.
Description of property definition and use
The position property specifies the type of positioning method for an element (static, relative, absolute, or fixed).
| Default: | static |
|---|---|
| Inherited: | no |
| Version: | CSS2 |
| JavaScript syntax: | object .style.position="absolute" |
Browser support
The numbers in the table support the first browser version number of the property.
| Attributes | |||||
|---|---|---|---|---|---|
| position | 1.0 | 7.0 | 1.0 | 1.0 | 4.0 |
The property value
| Value | Describe | |
|---|---|---|
| absolute |
Creates an absolutely positioned element that is positioned relative to the first parent element other than static positioning. The position of the element is specified by the "left", "top", "right" and "bottom" properties. |
|
| fixed |
Creates fixed-positioned elements that are positioned relative to the browser window. The position of the element is specified by the "left", "top", "right" and "bottom" properties. |
|
| relative |
Creates relatively positioned elements that are positioned relative to their normal position. Therefore, left:20 adds 20 pixels to the left position of the element. |
|
| static | The default. Without positioning, elements appear in a normal stream (ignore top, bottom, left, right, or z-index declarations). | |
| inherit | Specifies that the value of the position property should be inherited from the parent element. | |
| initial | Set this property to the default, see the CSS initial keyword for details. | |
More instances
Position:relative
This example shows how an element is positioned relative to its normal position.
Related articles
CSS tutorial: CSS Positioning