An element whose
position property has the value
absolute is said to be absolutely positioned, and is
completely removed from the document flow: it doesn’t affect subsequent
elements at all. It’s positioned with respect to its containing block, and it establishes a
new containing block for normal flow children, and for descendants whose
position property is set to
determine the position and dimensions of an absolutely positioned
Both the position and the dimensions can be expressed using all four of
the positional properties (
left).1 Alternatively, you can
specify the position of one corner of the box using
bottom in combination with
right, and you can specify the dimensions using
width and (optionally)
An absolutely positioned element will overlap other content unless we make room for it in some way; for instance, by setting margins or padding on other elements. When several absolutely positioned elements occupy the same location, they’ll be stacked according to a stacking context.
Absolute positioning also makes it possible to place an element partly or entirely outside the viewport. This technique, which is known as the off-left technique, is sometimes used intentionally to hide content from visual user agents while keeping it visible for those using assistive technologies such as screen readers.2
- Fri, 08 Feb 2008 00:37:21 GMT
I'd recommend including the statement from your containing block section here:
If the value of the position property is absolute, the containing block is the nearest positioned ancestor—in other words, the nearest ancestor whose position property has one of the values absolute, fixed, or relative.
I think it's also important that in order to be a containing block for absolutely positioned objects, it must be explicitly positioned.