フッターを常に下に
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<title>無題ドキュメント</title>
<style>
<!--
* {
margin:0px;
padding:0px;
}
html, body {
color:#FFFFFF;
background-color:#3366CC;
height:100%;
}
#pagebuilding {
position: relative;
min-height: 100%;
}
#container {
padding-bottom: 120px;
}
#header {
background-color: #3399FF;
height: 120px;
}
#header h1 {
margin: 0px;
border-bottom-color: #FFFFFF;
padding: 20px 0px 0px 20px;
}
#container p {
margin-top: 20px;
margin-left: 20px;
}
#container dl {
margin-left: 30px;
margin-top: 20px;
margin-bottom: 20px;
}
#container dl dt {
float: left;
margin-right: 2em;
}
#container dl dd {
margin-bottom: 10px;
}
#footer {
position: absolute;
height: 120px;
width: 100%;
bottom: 0px;
background-color: #3399FF;
}
-->
</style>
</head>
<body>
<div id="pagebuilding">
<div id="container">
<div id="header">
<h1>CSS Design</h1>
</div>
<p>css Design</p>
<dl>
<dt>2009.06.13</dt>
<dd>辞職の鳩山氏 離党を否定せず</dd>
<dt>2009.06.13</dt>
<dd>田村正和 国際TV祭で最優秀賞</dd>
<dt>2009.06.13</dt>
<dd>イチローが上原から2本の長打</dd>
</dl>
</div>
<div id="footer">
<p>CSS Design</p>
</div>
</div>
</body>
</html>