Css Sibling Absolute Positioning

本小妞迷上赌 提交于 2019-12-18 03:01:34

问题


Is there any way to absolutely position a div relatively to its sibling? For example: Inside a div there are two other divs - div1 and div2. I want to absolutely position div2 relatively to div1.


回答1:


Absolute positioning is dependent on the "current positioning context", which may include a parent element (if absolutely or relatively positioned) but will never include a sibling element.

Can you reorganize your dom so that you have a parent-child instead of siblings? If so, you could set the parent's position to relative or absolute and the child's position to absolute and the child's position would remain absolute in relation to the parent.




回答2:


There is no way using absolute position, according to w3c specification:

In the absolute positioning model, a box is explicitly offset with respect to its containing block

— relatively to parent block, not to sibling one

And no way to use relative positioning, also according to to w3c specification:

Once a box has been laid out according to the normal flow or floated, it may be shifted relative to this position.

— relatively to block's position, not to sibling block

summary:

Nobody can solve problem you described




回答3:


Try it with jquery

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



回答4:


Depending on your needs, you can float them or position both absolute with appropriate left/top/right/bottom values.

Post your markup and explain exactly what you're trying to achieve.



来源:https://stackoverflow.com/questions/10624771/css-sibling-absolute-positioning

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!