久々にウェブサイト作成にいそしんでます。
ブランクが長すぎたせいか、ちょっとしたことでつまづいて、なかなか前に進んでません(T.T)

こんなやり方もあったなぁ、て言う小技があったので、私的備忘録として書き留めておく。

CSSを使って、レイアウトする際、行儀の悪いボックスに出くわすときがある。
自身のstyleや、親、はたまたその親のstyleまでいじって、最後には何をやってるのか分からなくなる。

原因は概ねfloat解除の不徹底。
対処はこちらに書いてあるように、floatを解除してあげたいところにコイツをいれてあげる。

<div style="clear: both;"></div> 

こちらを参考にしました。

「おしえて！goo: 【css】floatを指定するとはみ出しま す 」

教えて！goo

 

1 User

【css】floatを指定するとはみ出します

http://oshiete.goo.ne.jp/qa/3378821.html

ブロック要素をfioatで横並びにした際に、画像とテキストが全体を囲っている要素（親要素）からはみ出すことが多々あります。その度に高さを指定して回避しているのですが、こちらはその他に回避の方法というのは... - HTML・CSS 締切済 | 教えて！goo

いろいろ調べたところ、この解除方法は邪道らしい。
レイアウトに関わるところは、スタイルシートに！と言う鉄則からすると、前述のタグはゴミになるとか。
正当なやり方で行けば、crearfixと言うのを使うべきらしいが、感覚的には前述のタグを挿入するやり方が馴染みやすいよなぁ。

Pocket

Tweet