3

这应该是一个非常简单的。我需要“橙色”div 始终覆盖 100% 的宽度和 100% 的高度。

在那个 div 中，我需要“绿色”div 来填充其父级“橙色”div 的 100% 宽度和高度。

此外，“橙色”div 内必须始终有 10 像素的“填充”。

调整窗口大小时，每个 div 必须分别“调整大小”，以便没有滚动条。

http://jsfiddle.net/URwpA/3/

4

2 回答 2

7

第一种方式：

#hold {
 position:absolute;
 top:0px;
 left:0px;
 bottom:0px;
 right:0px;
 background:orange;
 padding:10px;
}
#held {
 position:relative;
 width:100%;
 height:100%;
 background:green;
}

第二种方式：

#hold {
 position:absolute;
 top:0px;
 left:0px;
 bottom:0px;
 right:0px;
 background:orange;
}
#held {
 position:absolute;
 top:10px;
 left:10px;
 bottom:10px;
 right:10px;
 background:green;
}

编辑：我能想到的实现我认为在评论中要求的布局的唯一方法如下：

<html style="height: 100%;">
  <body style="height: 100%;">
    <table style="height: 100%; width: 100%; border: 10px solid orange; background-color: green;">
      <!-- etc... -->
    </table>
  </body>
</html>
于 2012-04-11T20:34:31.600 回答
0

我相信你正在寻找这样的东西？

#hold {
position:fixed;
background:orange;
width:100%;
height:100%;
padding:10px;
}
#held {
position:relative;
width:100%;
height:100%;
background:green;
}
于 2012-04-11T20:31:31.053 回答