2012-08-10 93 views
1

对于客户端,我必须做全屏网站,响应式设计。我正在使用带有固定导航栏的Bootstrap,因此为了放置我的内容,我在身体上添加了一个60px的顶部填充。Bootstrap固定导航栏:padding-top和body 100%

这是我的问题:滚动条显示系统,因为我的身体有100%的高度和60px的填充顶部。我可以使用'overflow:hidden'',但是如果我需要滚动页面,我不能再使用了。

您有解决方案吗?

谢谢!

编辑:这是想法:http://jsfiddle.net/StFca/ 在这种情况下,我想滚动条被隐藏,因为没有必要这样做。

回答

2

而是添加填充到身体的,你可以在margin-top: 60px属性添加到一个新的类或ID,您可以添加到您的网站内容的主容器,所以它看起来是这样的:

#main-container { 
    margin-top: 60px; 
} 

通过这种方式,您可以通过将容器本身从容器中推出来而不是文档的正文来容纳导航栏,并且滚动条将消失。

+0

是的,但这是同样的问题,系统溢出=/ – 2012-08-10 11:01:03

+0

@JérémyDutheil这是我用上面发布的相同方法制作的演示,http://jsfiddle.net/CDwKV/show/,滚动条不是出现。也许有些内容在您的案例中超过了视口? – 2012-08-10 11:11:45

+0

这是我的情况:http://www.jeremy-dutheil.fr/barconniere/ 即使内容不是太大,你也可以看到溢出=/ – 2012-08-10 11:15:29