Question

我有两个div，一个在另一个里面，我定义了样式。封装的是相对的，孩子是绝对的。

孩子是不是应该根据外部div的左上角定位，＃RightSection？

相反，它是根据浏览器窗口，任何线索进行的？

        <div id="RightSection">
            <div id="Panels">

            </div>
        </div>

#RightSection
 {
     position: relative;
 }

#Panels
 {
    position: absolute;
    background-color: Blue;
    width: 100px;
    height: 100px;
    z-index: 9000;
 }

Answer 1

相对定位元素内部的绝对定位应该按照您的描述进行，但并不总是支持行为。你使用什么浏览器以及你在服务什么DTD？

有关详细信息，请参阅http://www.brainjar.com/css/positioning/default4.asp。它还有一个定位演示，以便您可以在浏览器中验证它是否有效。

我可以确认这在IE6中不起作用。不过，在我工作的时候，我无法为其他浏览器担保。在网上进行简短的搜索让我相信IE7中也存在这个问题，只要它在IE7模式下渲染，IE8中就会出现问题。

Answer 2

我还发现，如果我没有为绝对定位的元素声明top和left css参数，它似乎忽略了它上面的父级，只是跳转到页面的主体。

尝试给它顶部和左侧参数，看它是否有帮助，

#Panels
 {
    position: absolute;
    top: 0;
    left: 0;
    background-color: Blue;
    width: 100px;
    height: 100px;
    z-index: 9000;
 }

添加这些默认参数后，它应该看起来很好。

为什么我的位置绝对子项相对于浏览器窗口而不是其位置相对父项？

2 个答案: