CSSにおけるブロックのfloatプロパティ
プロパティfloatは、
画像だけでなく、他のあらゆるブロックにも適用できます。
これを確認してみましょう。
クラスparentの親ブロックがあり、
その中にテキストとクラスchildの子ブロックがあるとします。
両方のブロックに境界線が設定されており、
子要素には幅と高さも設定されています：
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
width: 200px;
height: 100px;
border: 1px solid green;
}
:
次に、子要素のfloatを
値leftに設定してみましょう。テキストがブロックを回り込み始めます：
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
float: left;
width: 200px;
height: 100px;
border: 1px solid green;
}
:
