html - css div 自动填充文档内的所有可用空间

Question

我正在尝试获取一个 div，它是文档的宽度和高度。 如图所示，周围负 10 个像素: http://screensnapr.com/v/a9JWIf.png

但每次我填充或添加到主体或外部 div 的边距时，它都会增加文档的总高度并显示滚动条。

如何在不扩展文档大小的情况下使 div 自动填充所有可用大小？

编辑:任何负边距都不会影响 div 的总大小

这是一个 fiddle http://jsfiddle.net/ZRz32/6/

如您所见，它扩展了文档高度。 我需要它使文档的大小始终减去 10 个像素

Answer 1

我认为这是最简单的方法:

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
#container {
    width: 100%;
    height: 100%;
}
#main {
    position: absolute;
    height: auto;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    margin: 10px;
    background-color: green;
}

<div id="container">
    <div id="main"></div>
</div>

我更新了你的 Fiddle here .