html - 尽管祖先具有绝对位置，但如何使元素在页面中的位置绝对

Question

考虑一下:

<div class="normal">
  <div class="abs1">
    ...
    <div class="abs2">
    </div>
  </div>
</div>

使用这个 CSS

.abs1 {
  position: absolute;
}
.abs2 {
  position: absolute;
}

所以，.abs2 div 的位置是相对于它的 .abs1 祖先的。如果我需要它与文档相关，或者与层次结构中更高的另一个祖先相关怎么办？那可能吗？怎么办？

Answer 1

这里有很好的答案:

Because position: absolute resets the relative position for children just as position: relative does.

There is no way around this - if you want the third div to be absolutely positioned relatively to the first one, you will have to make it a child of the first one.

来源:https://stackoverflow.com/a/5928069/5814976