包含块

在 CSS 中，position: absolute 元素是相对于其最近的包含块定位的。而包含块的定义除了看 position 以外（如最近的非 static 定位的祖先元素），还有一些其他触发条件，比如设置了以下属性之一的元素：

• filter、backdrop-filter、transform、perspective 的值不为 none
• contain 的值是 layout、paint、strict 或 content（例如：contain: paint;）
• content-type 的值不为 normal
• content-visibility 的值为 auto
• will-change 值包含一个属性，该属性的非初始值将形成一个包含块（例如，filter 或 transform）。

如给元素加 transform: translateZ(0) 会让它成为定位上下文，使其伪元素 ::after 在 position: absolute 时以它为参考定位。

参考

• 布局和包含块