Css兄弟绝对定位

Question

有没有办法绝对将div放在兄弟姐妹身上？例如：在div内部还有另外两个div - div1和div2。我想绝对将div2定位到div1。

Answer 1

绝对定位取决于"current positioning context"，{{3}}可能包含父元素（如果绝对或相对定位）但永远不会包含兄弟​​元素。

你能重组你的dom，以便你有一个亲子而不是兄弟姐妹吗？如果是这样，你可以将父母的位置设置为相对或绝对，并将孩子的位置设置为绝对位置，并且孩子的位置相对于父母的位置将保持绝对。

Answer 2

根据 w3c specification，无法使用绝对位置：

  

在绝对定位模型中，框相对于其包含块

显式偏移

- 相对于父块，而不是兄弟一个

也无法使用相对定位，也可以根据 w3c specification：

  

一旦根据正常流量布置了一个方框或浮动，它可能会相对于此位置移位。

- 相对于阻止位置，而不是兄弟阻止

摘要：

没人能解决你描述的问题

Answer 3

使用jquery

尝试

<script type="text/javascript">
        $('#div2').css('margin-left', $('#div1').outerWidth() +XXX + 'px');

Answer 4

根据您的需要，您可以使用适当的左/上/右/下值浮动它们或将它们放置在绝对位置。

发布你的标记并准确解释你想要实现的目标。

Answer 5

正确答案是：否，但是至少它的垂直位置可以受到同级兄弟的影响。

在其他答案中，绝对定位的div的位置相对于其祖先。为了准确起见，在遍历DOM树时，它相对于不是静态定位的第一个祖先。

但是：绝对定位的元素也会受到其兄弟姐妹（元素在之前的兄弟姐妹）的影响。如果这些在先的兄弟姐妹是相对放置的，并且您的绝对放置的元素未设置其顶级属性 ，则它会垂直放置在那些相对放置的兄弟姐妹的下方。

~/Library/Preferences/VisualStudio/8.0/

查看此小提琴： https://jsfiddle.net/fgxeu54t/28/