スタイルシートレイアウトの基礎

スタイルシートレイアウト（段組）の基礎

<div></div>というタグを使用します。<div>タグはもともと見出しや文章といった個々のパーツをグループ化する為のboxです。

<div>の特徴として<div>～</div>の範囲は限りなく横に広がる（他のどの要素にも邪魔されない）というのがあります。

簡単に説明すると下記の図のような感じです。

と同じ結果になります。因みに、boxAとboxBのwidth指定をしても

となります。面白いですね！

【float】という属性を指定してやります。floatは、要素の配置や回り込みを指定するためのタグです。

【boxA】に【float:left 】を設定

こんな感じ！

【boxA】に【float:right】を設定

こんな感じ！

当サイトの設定では【boxAにfloat:left】【boxBにfloat:right】を設定します

こんな感じ！

【float】を指定する際は【width】を必ず指定して下さい！レイアウトが崩れる要因のひとつです。

当サイトでは【clear: bothを指定してます。まあ当サイトに限らずこれを指定しておけばまず安心です！