CSSでフッターだけをウインドウの下に固定させる方法をメモ

> サンプル

サンプルの例で言うと、まず

</pre>
<div id="header">ヘッダー部分</div>
<div id="content">コンテンツ部分</div>
<div id="footer">フッター部分</div>
<pre>

のような構造のhtmlがあります。
それぞれのidにCSSを適用させるのですが、
まず
CSSでフッターをウインドウの下部に固定させる
方法としては、footerに対して

#footer {
	position: fixed	!important;
	position: absolute;
	bottom: 0;
	left: 0;
~中略~
}

と指定すればOKです。

ただし、このまま適用させるとコンテンツ部分がフッターと重なってしまい見れなくなるので
もし仮に#footerの高さが100pxだとすれば、

#content {
~中略~
	margin-bottom:100px;
}
#footer {
	position: fixed	!important;
	position: absolute;
	bottom: 0;
	left: 0;
	height:100px;
~中略~
}

のようにcontentに
margin-bottom:ヘッダーの高さ;
を指定すればOKです。