メインコンテンツを作る

次に2カラムレイアウトのメインコンテンツを作ります。

1pxの枠線で横幅540pxのボックスを作ります。

次に右メニューのボックスがあるため横幅540pxのボックスの右側の枠線の外側に 5px程度の適度な余白を入れます。また、メインコンテンツのボックスの右横にライトボックスが並ぶため540pxのボックスに float:left;を指定します。

【ブラウザ表示】

ここにメインコンテンツを記述します。

メインコンテンツのソース

<div id="middle">ここにメインコンテンツを記述します。</div>

外部ファイル

div#middle{
border:1px solid silver;
line-height:1.2;
width:540px;
height:400px;
font-size:95%;
margin-right:5px;
float:left;
text-align:left;
}