を必要としている、私はリンクを覚えているが、ここではそれのためのCSSとHTMLであるカント：
CSS：
body, html{
height: 100%;
}
body, p {
margin: 0; padding: 0;
}
#wrapper {
min-height: 100%;
}
* html #wrapper {
height: 100%;
}
/*HEADER------------------------------------*/
#header {
width: 100%;
background: #666;
}
#header_900 {
width: 960px;
height: 100px;
margin: 0 auto;
position: relative;
overflow: hidden;
}
/*FOOTER------------------------------------*/
#footer {
width: 100%;
height: 100px;
margin: -100px auto 0 auto; /*THIS SHOULD BE EQUAL TO THE FOOTERS HEIGHT*/
position: relative;
background: #666;
}
#footer_900 {
width: 960px;
height: 100px;/*THIS IS THE FOOTERS HEIGHT*/
position: relative;
margin: 0 auto;
}
/*CONTENT------------------------------------*/
#content {
width: 100%;
padding-bottom: 100px; /*THIS SHOULD BE EQUAL TO THE FOOTERS HEIGHT*/
}
#content_900 {
width: 960px;
margin: 0 auto;
overflow: hidden;
}
そしてここにHTMLである：
<body>
<div id="wrapper">
<div id="header">
<div id="header_900">
<p>header</p>
</div><!--header_900-->
</div><!--header-->
<div id="content">
<div id="content_900">
<p>content</p>
</div><!--content-->
</div><!--content-->
</div><!--wrapper-->
<div id="footer">
<div id="footer_900">
<p>footer</p>
</div><!--footer_900-->
</div><!--footer-->
</body>
ええと...私はCSSを嫌いです。そして、これが理由です。それは、あなたが良い答えを得ることを願っています。 –
なぜ誰かがこの質問に時間を費やしたいと思うのか分かりません。ちょうど最初のオプションを選択して使用してください。長い間それを使用していたし、問題がなかった。 IE6を含むすべての一般的なブラウザで動作します。 – Tom
大学の論文の時代が戻ってきました！ =） – SuperDuck