「float」を指定した要素は、通常のフロー（通常の流れ）から外れます。 親要素の高さは、フロートされた子要素の高さを含めません。 そのため、回り込みした文字列より大きな画像等の場合は、親要素からはみ出してしまします。 heightがauto(初期値)である場合、対応策の１つとして 親要素のoverflow値をvisible以外の値にするとその親要素は、フロートを含むように広げられる。 overf […]

webkit系のデフォルトスタイルシート http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css

画像下部に標準で挿入されるスペースは、マージンやパディングではない。 画像は、インラインブロックボックスで構成されるため、文字や画像と横に並べて表示される。 このとき、画像の下辺が文字のベースラインにそろえて表示されるため、ページラインから下のスペースが画像の下に挿入される。 ベースラインより下のスペースを画像に挿入しないようにするためには、vertical-alignを「bottom」に指定する […]

画像を表示する<img>が構成するボックスは「インラインブロックボックス」と呼ばれ、ブロックボックスとインラインボックスの両方の特徴をあわせ持ったものになっている。 インラインボックスと同じように前後に改行が入らず、文字などと並んで表示される。 ブロックボックスと同じように、スタイルシートで横幅や高さを指定できる。 マージンやパディング、罫線を挿入すると、まわりのコンテンツの配置に影響 […]

HTML4.01やXHTMLの時、区切り線に<hr>タグを使用していたが、HTML5では、<hr>タグは、場面転換といった段落の論理的な区切りを示すものと定義されているので視覚的なデザインを施すために利用してはいけない。 「見出しと文章を区切る」といった視覚的な目的にはスタイルシートでborderプロパティ指定する。