Menubar在使用锚链接时隐藏div

Question

我使用Bootstrap，顶部有一个固定的菜单栏。我在我的身上添加了一个填充顶部，以便正确显示div。

body {
    padding-top: 80px;
}

一切都很好但是，当我尝试使用锚点导航时，不再有填充，我的div部分隐藏。

你可以在这个JSFiddle上找到一个例子。 http://jsfiddle.net/TUy7C/

如何解决这个问题？

Answer 1

您可以将填充应用于每个部分而不是正文，然后添加负底部边距以缩小部分之间的间隙：

http://jsfiddle.net/TUy7C/2/

#home, #about, #contact {
    padding-top: 80px;
    margin-bottom: -80px;
}