lobotomized owl selector
body * + * {
margin-top: 1.5em;
}
floatを解除する
<div style="clear: both"></div>
float
floatは文字通り指定されたブロックを”浮き上がらさせて”、指定された”場所”に引っ張る。浮き上がった場所は空間が開く。この隙間に対してinline要素は入り込めない。これによりイメージに対するテキストの回り込みを使ったレイアウトを作れる。しかしblock要素は入り込めるために想定したレイアウトが崩れることがある。
floatの隙間空間への引き込みはdisplay:inlineで解除できる。しかしinlineではwidth, heightが指定できないために、インラインテキストがないと大きさが0になり消滅する。対応方法としてはinline-blockを使う。
marginの相殺
marginの相殺とは大きいサイズのmarginのみが有効になること。ポイントはmarginの相殺がどのタグ同士で起きるか。margin相殺を起こさないためにどうすればよいか。
clearプロパティが有効な要素
ブロックタイプ要素
回り込みの解除をする
一番簡単な方法は overflow:auto
