| Inherited | Initial | Version |
|---|---|---|
| No | auto |
CSS2 |
| IE7+ | FF1+ | SA1.3+ | OP9.2+ | CH2+ |
|---|---|---|---|---|
| Full | Full | Full | Full | Full |
Syntax
Description
For absolutely positioned
boxes, this property specifies how far the top margin edge of the box is
offset below the top padding edge of its containing block. However, should
the value for top be auto (the
initial value), the top margin edge of the box will be positioned at the
top content edge of its containing block.
For relatively positioned boxes, this property specifies how far the top edge of the box is offset below the position it would have had in the normal flow.
Negative values are allowed and would result in the element being moved in the opposite direction to those already stated above.
Example
This style rule makes the element
with ID "logo" generate a relatively positioned box
that’s shifted down by ten pixels:
#logo {
position: relative;
top: 10px;
}
Compatibility
| Internet Explorer | Firefox | Safari | Opera | Chrome | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 5.5 | 6.0 | 7.0 | 8.0 | 1.0 | 1.5 | 2.0 | 3.0 | 3.5 | 1.3 | 2.0 | 3.1 | 4.0 | 9.2 | 9.5 | 10.0 | 2.0 |
| Buggy | Buggy | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full |
Internet Explorer for Windows versions up to and including 6:
- compute percentage values on the basis of the height of the parent block, rather than of the containing block
don’t support the specification of both the position and the dimensions of an absolutely positioned element using
top,right,bottom, andlefttogether; they’ll use the last vertical and horizontal position specified, and need the dimensions to be specified usingwidthandheight
Internet Explorer for Windows versions up to and
including 7 don’t support the value inherit.