css - 为什么我的位置绝对子项是相对于浏览器窗口放置的,而不是相对于父项的位置?

标签 css

我有这两个 div,一个在另一个里面,我定义了样式。封装的是相对的, child 是绝对的。

child 不是应该根据外部 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;
 }

最佳答案

我还发现,如果我没有为绝对定位元素声明 top 和 left css 参数,它似乎会忽略其上方的父级并直接跳转到页面主体。

尝试只给它 top 和 left 参数,看看是否有帮助,

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

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

关于css - 为什么我的位置绝对子项是相对于浏览器窗口放置的,而不是相对于父项的位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1167509/

相关文章:

jquery - EmberJS 应用程序...可以与 UI 框架集成吗?

javascript - Bootstrap Carousel 改为堆叠图像

CSS 下拉菜单 z-index 问题

javascript - CSS3,旋转后di​​v未正确对齐

CSS 背景过滤器不适用于过渡

css - 调整窗口大小时,如何使 div 及其文本消失?

html - 没有容器的中心无序列表

html - CSS 导航栏内容缩放

html - table layout fixed 是如何渲染的?

html - 如何在 Bootstrap 中将填充添加到 100% div?