html - 页面换行不占用最小高度

Question

我有以下代码

html ,body {
    height: 100%;
    font-style: Helvetica;
}
.page_background, .page { margin: 0 auto; }
.page_background {
    width: 100%;
    min-height: 100%;
    background: -webkit-linear-gradient(#282828, #888888); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#282828, #888888); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#282828, #888888); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#282828, #888888); /* Standard syntax */
    position: absolute;
    /*height: 100%;*/
}
.page {
    background-color: #FFFFFF;
    width: 85%;
    min-height: 100%;
    bottom: 0;
    position: absolute;
    height: 100%;
    left: 7.5%;
}

        <div class="page_background">
            <div class="page">
            </div>
        </div>

如果页面超过屏幕的整个高度(您必须滚动)，背景颜色将不适用。我设置了 min-height: 100%; 并尝试了 height: 100%;。两者似乎都不起作用。我做错了什么？

Answer 1

您只需要重置默认浏览器样式 - 边距，就像这样

html ,body {
  height: 100%;
  font-style: Helvetica;
  margin :0;
}

https://jsfiddle.net/b0txv2m2/5/