画面の高さいっぱいに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だけでしたほうが良いと思います。
何事もシンプルが一番です。

コメントは受け付けていません。