レイアウトにDIV

css

超今更ですが、今までtableタグでしかレイアウトしたことなかったもんで。。恥ずかしっ。
でもちょっとやってみたら予想通りだったので、すぐ出来ました♪ポイントは「float:left」って所やね。
そういや、iGoogleもちょっと前まではtableレイアウトだったのに最近見たらdivに置き換わってた。やっぱ今はこっちなんですな。

blogとかでよくあるレイアウト

ヘッダとフッタと、両サイド、本文。色は適当。ダサダサ。

<html>
<head></head>
<body>
    <div style="width:800px;height:800px;margin:auto;">
        <div style="width:100%;height:20%;background-color:#AAAAAA;"></div>
        <div style="float:left;width:20%;height:70%;background-color:#115511;"></div>
        <div style="float:left;width:60%;height:70%;background-color:#FFFFFF;"></div>
        <div style="float:left;width:20%;height:70%;background-color:#115511;"></div>
        <div style="float:left;width:100%;height:10%;background-color:#AAAAAA;"></div>    
    </div>
</body>