如何在不掌握其他内容的情况下让我的固定元素独立存在？

Question

我的页面顶部有一个专门作为顶栏的div。我想要修复位置，以便在滚动时它保持在同一个位置。但是......一旦我应用固定定位，所有内容都会向上移动约30px（条形图的大小）并位于条形图后面，使标题看起来比它应该更小。

一旦从#topbar移除了position：fixed的css，内容就会向下移动到它所需的位置 代码通过codepen：http://codepen.io/Hafkamp/pen/jabmE

CSS

#topbar{position:fixed}

Answer 1

到#topbar，添加CSS：

#topbar{
    top:0;
}

另外，对#header添加：

#header{
    margin-top:30px;
}

这样，你的#topbar会粘在页面顶部，下面的html将被推下30px（#topbar的高度）

Answer 2

只需将边距放在30px标题的顶部