| Inherited | Initial | Version |
|---|---|---|
| No | auto |
CSS2 |
| IE7+ | FF1+ | SA1.3+ | OP9.2+ | CH2+ |
|---|---|---|---|---|
| Full | Full | Full | Buggy | Full |
Syntax
Description
For absolutely positioned boxes, this property specifies how far the right margin edge of the box is offset from the left of the right padding 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 right edge of the box is offset from the left 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 "sidebar" generate an absolutely positioned box
at the top right-hand corner of its containing block:
#sidebar {
position: absolute;
top: 0;
right: 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 | Buggy | Buggy | Buggy | 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
- are one pixel off when
rightorbottomare used to specify the position, and the offset is an odd number of pixels 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
.
User-contributed notes
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.
