相对于绝对定位元素的定位 - 是否可能？

Question

我在页面上有一些绝对定位的空间，然后在这个空间中有多个绝对定位的元素......效果很好......每当我需要添加另一个元素时，我不必担心页面流...我只是把它放在我想要的地方使用xy平面。

问题我现在是...现在我在其中一个绝对定位的元素中有一些动态内容...随着它的增长它的z - index低于底部元素所以它只是在它下面的元素下扩展

我希望它下面的元素向上移动，因为它上面的元素会扩展。

我尝试将下面的elemenet的定位设置为“relative”，但这只是相对于父div ...而不是它的兄弟div ...因此它跳转到页面的顶部。 “静态”定位具有与跳到顶部相同的效果。似乎绝对定位的元素基本上被相对和静态定位元素忽略。

当兄弟姐妹成长的时候，是否可以让兄弟姐妹移动？

有没有办法让相对定位的元素“明白”绝对定位元素？

我喜欢绝对的positoine元素，所以我希望在尽可能使用它们的同时扩展conntent。

Answer 1

绝对定位的元素会忽略并被页面上的其他内容忽略，从而有效地将其从文档流中取出，因此严格来说，您无法按照自己的要求进行操作。

你可以在这里做些什么来获得相同的效果是将两个元素包装在一个绝对定位的div中，并让它们相互相对定位。然后顶部div将始终保持在同一位置，底部div将根据需要向下移动。

<style>
    #wrapper { position:absolute; }
    #i_will_expand { position:relative; top:0px; left:0px; }
    #i_will_move_down { position:relative; top:0px; left:0px; }
</style>

<div id="wrapper">
    <div id="i_will_expand"></div>
    <div id="i_will_move_down"></div>
</div>

请注意，如果您还有其他任何内容，这些元素将覆盖它们，但这是使用绝对定位的问题。