滚动时使相对位置div跟随固定位置div

【问题标题】：Make a relative position div follow a fixed position div when scrolling滚动时使相对位置div跟随固定位置div
【发布时间】：2014-03-19 12:56:12
【问题描述】：

所以这是我的问题。我有两个 div，当我向下滚动页面时，我希望能够同时看到它们。两个 div 都在同一个父容器中。如果我给父母一个位置：固定，底部的 div 会被切断，因为你必须滚动才能看到它的全高。所以我尝试了这个。我给了 position:fixed 到顶部的 div，以及相对于底部的位置。固定的人现在会滚动，但亲戚不会“跟随”或停留在其下方。

有什么想法吗？

【问题讨论】：

请提供一个 jsfiddle 以获得有用的答案
这里有一个小提琴jsfiddle.net/LC3zw ... 所以，银色 div 是固定的，滚动时红色应该始终保持在其下方

标签： css html css-position

【解决方案1】：

如果我理解正确，答案是将两个 div 绝对定位在固定父级中。

JSFiddle DEMO

HTML

<div class="parent">
    <div class="topDiv"></div>
    <div class="bottomDiv"></div>
</div

CSS

.parent {
    height:1500px;
    width:200px;
    border:1px solid grey;
    position: fixed;
}
.topDiv {
    display:block;
    background:silver;
    width:100px;
    height:100px;
    position:absolute;
    top:0;
    left:0
}
.bottomDiv {
    background:red;
    width:100px;
    height:100px;
    position:absolute;
    top:130px;
    left:0
}

【讨论】：