すべてはヒドゥン

広島帰省中。

母のパソコン環境があてにならなそうだったので、カフェの課題はなんとか学校で終わらせて帰りました。（夜になって大胆な間違いを発見したけどもういい）

この課題で初めてページものを作ったけど、cyllabus（シラバス）のバナナの課題が結構参考になった気がする。書き写すだけであまり勉強にならないよーって、やってるときは思ってたんだけど、ページものを作るときの考え方が自然と腹に落ちてた。

ただ、学校で習ったのとは違う書き方も多いし、多くの疑問点は残したまま。1点だけどうしても気になったところは課題提出のときに先生に質問しました。

以下、私の質問

この課題ではfloatプロパティの下に

<div class="clear"></div>　が置いてあり、

スタイルシートで

.clear{ clear:both; }

となっていました。

overflow:hidden　ではなく

.clear{ clear:both; } にすると

何かメリットがあるのでしょうか？

複数ページの場合に一度にスタイルが指定できるのは

便利だと感じました。

授業中に clearの説明もしていただいたと思うのですが、

今まで使う場所がなかったので理解できていませんでした。

そして先生からの回答

<div class="clear"></div>　

この記述は、完全な文法違反です。

コンテンツが存在しないのに、clearのためだけにdiv要素で箱を作っています。

それを、classで割り当てたのが、テキストにも書いてあるclearfixです。

これも、現在では不要です。

すべては、overflow:hiddenで解決できます。

いま最も必然性のある設定は、

overflow:hidden

です。

clearは、例えばp要素内にある画像をfloatさせたときに、その回りこみを解除するときのみに使用します。

例えば、cafe課題のp要素内にある画像をfloatさせたときに、その下に続くh3に指定したりします。

ただし、空きが作りにくくなるので、clearはあまり使用するべきではありません。

レイアウトのfloatを無視させるためには、overflow:hiddenを記述すれば解決します。