CSS 中,为什么绝对定位(absolute)的父级元素必须是相对定位(relative)?

CSS2 标准 9.6 节:
In the absolute positioning model, a box is explicitly offset with respect to its containing block. It is removed from the normal flow entirely (it has no impact on later siblings). An absolutely positioned box establishes a new containing block for normal flow children and absolutely (but not fixed) positioned descendants.
w3schools.com/css/css_p
An absolute position element is positioned relative to the first parent element that has a position other than static. If no such element is found, the containing block is <html>.
故此 absolute 元素的定位是上溯父级元素,找第一个不是 static 的元素,以其为 absolute 的基准。所以题目补充说明里的说法是不准确的。实际上,

如果父级元素是绝对定位,则里面的绝对定位自动以此父级元素定位;
如果父级元素全都没有设置(static),则里面的绝对定位以 body 定位。

验证:
<div style="position:absolute; top:20px; left:20px; width:200px; height:200px; background:red;">
<div style="position:absolute; top:20px; left:20px; width:100px; height:100px; background:orange;"></div>
</div>

显示:
minus.com/ltH8O0GPovDU3
原发布于 https://www.zhihu.com/question/19926700/answer/13373512