1

私は長い間私のウェブページに大きな問題を抱えていました。あなたの助けを借りて私の問題に対する答えを見つけられることを願っています. ページのコンテンツ (個々のページによって長さが異なります) を含む div でページの長さを引き伸ばしたいのですが、それはウィンドウの長さだけを引き伸ばします。HTML と CSS は次のとおりです。

HTML (非常に基本的な構造のみを含めました):

<html>
<body>
<div class="container">
<div id="content">
<div id="..."></div>
<div id="..."></div>
<div id="..."></div>
<div id="..."></div>
</div>
</div>
</body>
</html>`

CSS:

html, body {
height: 100%;
font-family: Arial;
font-size: 10px;
color: #000000;
background: #FFF url(../../images/body.png) no-repeat center 40px;
margin: 0;
position: relative;}

.container {
height: 100%;
width: 960px;
margin-right: auto;
margin-left: auto;
position: relative;}

#content  {
width: 939px;
min-height: 100%;
position: absolute;
top: 210px;
left: 6px;
box-shadow: 0px 0px 8px #666;
-moz-box-shadow: 0px 0px 8px #666;
-webkit-box-shadow: 0px 0px 8px #666;
background-color: #FFF;}

content div を overflow: auto に設定しようとしましたが、これには不要な content div のスクロール バーが含まれています。何か不足していますか？min-height が機能すると思っていましたが、機能しません。問題がどこにあるのか誰にもわかりますか？

よろしくお願いいたします。

4

2 に答える 2

4

コンテンツ div は にありposition: absoluteます。の場合absolute、要素はページの通常の流れを終了します。つまり、要素は親に対して相対的に配置またはストレッチすることはできず、ウィンドウに対してのみ相対的です。

于 2012-05-02T13:45:52.393 に答える
0

bottom: 0;コンテンツ divに追加してみてください。わたしにはできる。私のプロジェクトの1つで、非常によく似たレイアウトがありました。

于 2012-05-23T13:09:05.263 に答える