Question

我在滚动时在position: absolute和position:fixed之间交替显示div，你可以在这里看到我的代码（JSfiddle）：http://jsfiddle.net/g9NVj/2/

有问题的区域是滚动时会改变颜色的粉色和蓝色框。正确的宽度和位置（以及我想要的结果）是粉红色的盒子，蓝色是破碎的。蓝色框（.fix）更改为position:fixed并且似乎拥抱窗口的左侧并获得不同的宽度（在菜单侧边栏后面）而不是使用其父级。

我尝试添加位置：相对于父级，但它不能解决问题。

这是小提琴关键区域的片段，但请查看JSFiddle以获取完整代码：

.content {
    width: 100%;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #CCD5D5;
}

.c-2 {
    width: 50%;
    min-height:1px;
    float:left;
    overflow: hidden;
    /*position: relative;  TRIED THIS BUT DOESN"T WORK */
}

.c-2.last {
    padding: 80px;
}

.sticky {
    z-index: -1;
    background: #e4f;
}

.fix {
    position:fixed;
    width:50%;
    top: 0;
    left: 0;
    background: #34e;
}

.abs {
    position:absolute;
    bottom:0;
    width:50%;
    left:0;
    background: #e4f;
}

Answer 1

这是因为position:fixed是相对于浏览器窗口的，因此向父position:relative添加div对您没有帮助。如果您希望.fix div相对于父div，则应该为其position:absolute，父div为position:relative。< / p>

固定位置忽略父母？

1 个答案: