OLIVESYSTEM(オリーブシステム)

[CSS]中央揃えの2カラムレイアウト

中央揃えの2カラムレイアウトでのスタイルシート記述。

– HTML –

<div id="waku">
<div id="header">
ヘッダー
</div>
<div id="contents">
コンテンツ本文
</div>
<div id="menu">
メニュー
</div>
<br class="clear">
<div id="footer">
フッター
</div>
</div>

– CSS –

body{text-align:center;}
#waku{margin-left:auto;margin-right:auto;text-align:left;width:800px;}
#header{width:100%;}
#contents{width:750px;float:left;}
#menu{width:145px;float:right;}
#footer{width:100%;}
.clear{clear:both;}



[tmkm-amazon]4883375412[/tmkm-amazon]