css - 我如何让我的固定元素独立而不在其他内容之上？

Question

我在页面顶部有一个 div 专门用作顶部栏。我希望固定位置，以便在滚动时保持在同一个位置。但是.. 一旦我应用固定定位，所有内容都会向上移动大约 30px(栏的大小)并位于栏的后面，使标题的高度看起来比它应该的高度小。

一旦 position:fixed 的 css 从 #topbar 中移除，内容就会向下移动到它想要的位置通过代码笔代码: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 的高度)