3

これは非常に単純なはずです。常に幅 100%、高さ 100% をカバーするには、「オレンジ色」の div が必要です。

その 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;
}

2 番目の方法:

#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 に答える