CSSの記述をしていて、「画像の横に文章を回り込ませたい！」って時は多い。
そういう時はfloatプロパティを使えばいい。
HTMLで
<img src="~" alt="写真">
と記述するだけでは文章は画像の下に配置されるから、画像の横にスペースがあっても、回り込めない。
それを回り込ませるためには、floatプロパティを使って、
【CSS】
img{
float: left;
}
と記述する。
float: left は
「画像を左側に配置して、その反対側（右側）に文章を回り込ませますよ。」
っていう記述だ。
すると下図のように文章が画像の右側に回り込むのだ。
回り込む文章は、配置される画像の位置の反対側！
img{
float:left;
}
の場合、画像が左に配置されて、文章は右に回り込むから混乱しないようにしておきたい。
floatプロパティには
float:right→画像を右に配置して、文章を左側に回り込ませる
float:none→回り込みさせない（初期値はこれだから、普通は回り込まないのだ）
関連記事はこちら！
