画面の高さいっぱいにDIV要素を張り巡らせる
需要があるのかわかりませんが、たまに学生さんからの質問があるのでここに掲載しておきます。
セレクタやクラス、IDは各自で調整してくださいね。
html,body { height: 100%; } body { font-size: 100%; line-height: 160%; color: #000; text-align: center; background: #cccccc; } #container { margin: 0 auto; width: 1000px; height: 100%; min-height: 100%; text-align: left; background: #fff; } body > #container { height: auto; }
jqueryを使う方法もありますが、シンプルにCSSだけで実現できることはCSSだけでしたほうが良いと思います。
何事もシンプルが一番です。