インライン要素は自動的に改行が入るタグのことを指していうのですが、インライン要素のタグを使いつつ、横並びにしたい場面は結構あるわけです。

そこで、登場、floatプロパティ。

floatプロパティを使えば、HTMLにおけるインライン要素(<div>,<h1>等)のタグを使用した要素を、横一列に並べることができるのです。

なんと素晴らしいこと。

使用例を挙げるとするならば、ヘッダーでロゴや各カテゴリー名を一列に整列したいとき。

しかし、注意点として、その一列に入る要素のすべてのタグにfloatプロパティは設定する必要があります。

そして、横一列に並べた要素の後ろには、clearプロパティを指定してfloatを解除しましょう。

でないと、望んでもいないのにその一列の要素に回り込みが発生しちゃいます。

floatは次の要素に影響を及ぼしてしまうのですね。

こちらの記事がわかりやすいと思いました。