css - 内容高度太大时CSS边距不起作用

这是jsfiddle。
码：

<body>
    <div id="all">
        <p>just testing</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
            </br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
            </br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
            just testing
        </p>
    </div>
</body>

html, body {
    height : 100%;
}
#all {
    background-color: red;
    margin-top: 5%;
    margin-bottom: 5%;
    min-height: 95%;
}

我想要实现的是：
假设h是全屏高度。
h x 5%顶部的边距。
h x 90%内容。
底部的h x 5%边距。
如果内容不止一页，我只想保留页边距，让内容高度增加。

如果删除</br>标记中的所有<p>，则可以使用。
但是，如果我的内容超过一页，则底部空白消失。
那我该怎么办呢？

顺便说一句，css中95％的最小高度是正确的。（不是90％）。 MDN和W3School似乎暗示高度不包括边距/边距/边框。

最佳答案

在内容下添加一个div。

<body>
    <div id="all">
      <p>
        There is a lot of content here.
      </p>
    </div>
    <div style="height:1px"></div>
<body>

这是演示http://jsfiddle.net/jeZmR/

关于css - 内容高度太大时CSS边距不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19238314/