position: absolute 不算真正的等高，因为它通过固定高度强制拉伸元素，不随内容变化自适应，dom 高度实际不一致，且父容器需显式设 height 和 position:relative，无法响应软键盘、图片加载等动态变化，易导致错位或裁切。
position: absolute 可以“模拟”等高，但不是真正等高，也不响应内容变化。
为什么 position: absolute 不算真正的等高
它靠的是把两栏都拉到父容器顶部，并强制设相同高度，比如 height: 400px。一旦某栏内容超过这个值，文字会被裁切或溢出，overflow: hidden 只是掩盖问题，DOM 高度依然不一致。用 JavaScript 调 offsetHeight 就会暴露差异。
position: relative + absolute 的硬性前提
父容器必须满足两个条件，否则子元素根本无法定位到位：
- 必须设
position: relative（或absolute/fixed） - 必须有明确的
height值，不能是height: auto或未设置
常见错误是只写了 position: relative 却漏掉 height，结果两栏叠在一起或错位。
移动端和动态内容场景下极易失效
软键盘弹出、iOS 地址栏收起、图片异步加载完成——这些都会导致父容器实际渲染高度突变，而 absolute 子项不会自动重拉伸。你看到的“等高”只是初始快照，后续交互中大概率崩坏。
更麻烦的是：如果其中一栏用了 overflow-y: auto，另一栏却没加滚动条，视觉上立刻不对齐；而加了又可能因 padding/border 计算偏差造成微小错位。
别用它替代 display: flex 或 display: grid
现代布局中，flex 和 grid 才是解决等高的标准方案。absolute 定位只适合极少数静态、固定高度、无需响应式支持的后台管理页侧边栏之类场景。只要存在以下任一情况，就该放弃：
- 内容长度不可预知
- 需要适配小屏堆叠
- 后续可能加 JS 动态增删内容
- 要求可访问性或 SEO 友好
真正难的不是让两栏看起来一样高，而是让它们在各种真实交互中始终“保持一样高”。absolute 没有这个能力，它只是画了个框，框里装什么、装多少，它不管。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
