Absolute positioning
Tuesday, August 23rd, 2005[imported from Bloglines]
Creating a good, standards compliant layout that works across browsers is very difficult.
I was having trouble understanding why absolute positioning wasn’t working relative to a container I had.. you have to set the containers position to relative because the position is calculated using the “nearest positioned ancestor”
http://www.w3.org/TR/REC-CSS2/visuren.html#propdef-position
Quote:
9.8.4 Absolute positioning
Finally, we consider the effect of absolute positioning. Consider the following CSS declarations for outer and inner:
#outer {
position: absolute;
top: 200px; left: 200px;
width: 200px;
color: red;
}
#inner { color: blue }
which cause the top of the outer box to be positioned with respect to its containing block. The containing block for a positioned box is established by the nearest positioned ancestor (or, if none exists, the initial containing block, as in our example). The top side of the outer box is ‘200px’ below the top of the containing block and the left side is ‘200px’ from the left side. The child box of outer is flowed normally with respect to its parent.