css - 固定コンテンツを含む100％ヘッダーとラッパーを含める最も効率的な方法は？

Question

100％ヘッダー、次に固定幅コンテンツ、100％フッターを使用する最も効率的な方法は何ですか？

divを最大に制限しようとしていますが、今はかなり行き詰まっています...

誰か助けますか？

ありがとう

Answer 1

最も単純なバージョンは次のとおりです。

<div class="header">
    <p>Header</p>
</div>
<div class="main">
    <p>Content</p>
    <p>Content</p>
    <p>Content</p>
</div>
<div class="footer">
    <p>Footer</p>
</div>

CSS：

div {
    margin:0 auto;
}
.main{
    width:400px;
}

http://jsfiddle.net/Madmartigan/adkfF/3/

これは、メインコンテンツに合わせてヘッダーとフッターの内側のコンテンツの幅が固定されたバージョンです。

http://jsfiddle.net/Madmartigan/adkfF/1/

3 divは、できる限り単純です。「divを最大に制限する」のではなく、divを最小化することをお勧めします:)