正文和html高度100％使滚动条出现

Question

我知道这个问题已被问到，但我找到的解决方案不起作用。这里是我的代码：

body, html { 
    height: 100%; 
    background-color: white; 
} 
body { 
    margin: 0; 
    padding: 0; 
} 

问题是，一个垂直滚动条出现...你有任何想法我可以解决这个问题吗？

预先感谢您

Answer 1

您可以防止出现任何元素与下面的CSS滚动条：

overflow: hidden 

Answer 2

有做不使用溢出的“hackish的”的方式：隐藏;如果你想知道但我认为溢出：隐藏本身已经足够好了。退房代码：http://jsfiddle.net/rj3jecc1/

<div class="container"> 
    <div class="content">Content</div> 
    <div class="content">Content</div> 
    <div class="content">Content</div> 
</div> 

body,html{ 
    height:100%; 
    margin:0; 
    padding:0; 
} 
body{ 
    background:#ddd; 
} 
.container{ 
    padding-top:1px; 
} 
.content{ 
    background:#fff; 
    padding:20px; 
    margin:20px; 
} 

，当你的身体设置为100％高度的问题是，如果你有边距，它会“推”的直接子容器和超过100％的高度，导致滚动条出现。这就是为什么我添加了另一个1px的容器（甚至0.1，只要它>零）顶部填充，以防止这种解决方案在最新版本的主流浏览器中工作。

我不知道为什么你需要身高是100％，但我会尽量不指定它的身高，除非我知道我的内容太“矮”以适应身高（这不是常见的情况）。