| 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 left margin edge of the box is
offset to the right of the left padding edge of its containing block.
However, should the value for left be
auto (the initial value), the left margin edge of the
box is positioned at the left content edge of its containing
block.
Absolutely positioned boxes with both
right and left having a value other
than auto will effectively define the
width of the element assuming that the element's
width is auto. This may result in
the element having no width at all if
left and right positions occur at
the same point or perhaps overlap. If the values for
left,right and
width are over-constrained and the
direction property is ltr,
right will be ignored. If direction
is rtl, left will be ignored. Note
that replaced elements with a
width of auto will have the
elements intrinsic width substituted and the preceding rules
applied.
For relatively positioned boxes, this property specifies
how far the left edge of the box is offset to the right of the position it
would have had in the normal flow. If both right and
left have a value other than auto,
the offset is over-constrained. If the direction
property is ltr, right will be
ignored. If direction is rtl,
left will be ignored.
Negative values will move the element in the opposite direction to positive values.
Example
This style rule makes the element
with ID "nav" generate an absolutely positioned box at
the top left-hand corner of its containing block:
#nav {
position: absolute;
top: 0;
left: 0;
}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 width of the parent block, rather than that 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.
Opera
Versions up to and including 10 incorrectly ignore
right in an over-constrained situation when
direction has the value rtl
.
