CSS: Position Absolute

By Xah Lee. Date: . Last updated: .

What is Position Absolute

A Containing Block is the first parent element that has a position property value other than static. If none, it is relative to the Root Element.

Specify Offset

use one of:

  • top:length
  • bottom:length

and one of:

  • left:length
  • right:length

Example

AAA
BBB
CCC

Code

<div id="box-a-592">
 <div>AAA</div>
 <div id="box-b-702">BBB</div>
 <div>CCC</div>
</div>
#box-a-592 {
 position: relative;
}

#box-b-702 {
 position: absolute;
 top: 8px;
 left: 30px;
 color: red;
}

Example: Text Over Image

CSS Position

CSS Create Layer