IE6で縦方向にできる隙間│CSS│グラビカ学習帳～ホームページ制作会社 gravity works（グラビティ・ワークス）の備忘録と知識の共有と蓄積

今更な感じですが、IE6でのレイアウト崩れについてです。 ＜div＞や＜img＞などの要素を縦に並べたとき、余計な隙間ができてしまうことがあります。場合によって原因は変わってくると思いますが、起こりやすそうなものを書いてみます。 横幅にぴったりな＜img＞の下の隙間 ＜img＞タグで親の横幅にぴったりな画像を入れている場合、直下の要素との間が空いてしまうことがあります。 これは、＜img＞と要素の間の改行が原因であることが多いです。 ＜div＞ ＜img src="xxxxx"＞ ＜div＞ コンテンツ ＜/div＞ ＜/div＞ コードを見やすくするために改行したいものですが、改行は半角スペースに変換されてしまうため、横幅に納まりきらず縦に伸びてしまいます。 こういう場合は＜img＞タグ後の改行をとってしまうか、＜img＞タグの後ろに＜br /＞タグを入れれば解決できます。 ＜div＞