absolute 的包含块计算方式和正常流有什么不同?
- 内联元素也可以作为"包含块"所在的元素;
- "包含块"所在的元素不是父块级元素,而是最近的
position不为static的祖先元素或根元素; - 边界是
border-box而不是content-box。
补充:
- 包含块(containing block)决定了绝对定位元素的百分比、绝对定位偏移量的参考基准。
- 静态定位(默认)的元素其包含块是最近的块级祖先的 content-box;绝对定位元素的包含块是最近的
position: relative/absolute/fixed祖先元素的 padding-box(border-box 边缘),没有则回退到初始包含块(与 viewport 相关)。- 固定定位
position: fixed的包含块在多数情况下是 视口(viewport);但当祖先元素有transform/perspective/filter等属性时,会改为该祖先作为包含块(这是常见坑点)。



