html - min-height 设置为 100% 如果我也设置 padding 会导致滚动条

Question

我有一个容器，它创建一个从上到下的彩色列向下页面。我正在使用下面的 CSS。此代码将导致垂直滚动条出现，但是如果我删除 padding 属性它工作正常。它似乎正在将填充添加到高度。我希望在使用边距时会出现这种情况，因为它在容器外部，但填充在其中，据我所知不应影响它的大小。此容器没有父元素，仅包含一个单词作为内容。

如何在保留填充且无需创建任何额外的子元素的情况下使其达到 100% 高度？提前谢谢你。

#container
{
    background-color : #eee;
    max-width : 910px;
    min-height : 100%;
    padding : 65px 15px;
}

Answer 1

您可以在容器中添加box-sizing: border-box;以获得想要的结果；

http://jsfiddle.net/Svkp8/

这是一个detailed article Paul Irish 关于 box-sizing 的文章，由 steveax 在评论中提供。