不占用。绝对定位子元素脱离文档流，不再是Flex项目，justify-content、align-items等全部失效，其他兄弟元素无视其存在并重新分配空间。
绝对定位子元素是否占用Flex容器空间？
不占用。只要子元素设了 position: absolute，它就彻底脱离文档流，也不再是 Flex 项目 —— justify-content、align-items、flex-grow 全部失效，其他兄弟元素会无视它的存在，直接按剩余空间重新分配布局。
为什么Flex容器高度塌陷，导致absolute元素“消失”？
因为所有子项都是 position: absolute，没有一个普通流元素撑开容器高度，此时 Flex 容器的 height 计算结果为 0px，而 top: 50% 的 50% 就是 0，元素实际贴在顶部不可见。
- 检查 DevTools → Computed → 看父容器的
height是否为auto或0 - 临时加一个空的普通流子元素：
<div></div>，或设min-height: 100vh/height: fit-content - 避免硬写固定
height: 300px，响应式场景下容易断裂
想让absolute元素“看起来参与布局”，但又不破坏Flex流？
别让它当 Flex 子项，改用 wrapper 包裹：把 position: relative 加在真正参与 Flex 布局的父级上（比如卡片容器），再让 absolute 元素相对这个 wrapper 定位。
- 错误写法：
<div class="flex"><div class="abs"></div></div>（.flex 没position: relative） - 正确写法：
<div class="flex"><div class="card" style="position: relative;"><div class="abs"></div></div></div> - 这样 .abs 相对于 .card 定位，而 .card 仍是正常 Flex 项目，宽度、对齐、顺序全受控
absolute元素宽高为0，页面看不见？
这是最常被忽略的渲染前提：absolute 元素默认宽高由内容决定，若内容为空、或子元素也 absolute、或内部 flex 没撑开尺寸，它就会坍缩成 0×0。
立即学习“前端免费学习笔记（深入）”；
- 显式设置
width和/或height（如width: 100%、height: 2em） - 用
inset: 0替代top/left/bottom/right: 0，更简洁且自动填满 - 如果内部是 flex 容器，确保它的父级（即 absolute 元素）有可计算尺寸，否则
flex: 1无效
