位置固定的奇怪行为

这是一个代码笔，其意思是：https ://codepen.io/anon/pen/MReEQw和以下代码：

<div id="fixed">
</div>

<div id="content">
</div>


#fixed {
    height: 50px;
    width: 100%;
    background-color: green;
    position: fixed;
}

#content {
    height: 2000px;
    background: grey;
    margin-top: 50px;
}

这是保证金崩溃吗？为什么不能设置固定的div，然后在不重叠的div下设置一个div？