<ul>
<li><img src=”hoge.gif”/></li>
<li><img src=”fuga.gif” /></li>
</ul>
<li><img src=”hoge.gif”/></li>
<li><img src=”fuga.gif” /></li>
</ul>
こうやった場合にIE6では画像の上下に余白がでて、意図しない見え方になってしまう。
それを回避するには、CSSにて以下の記述をすれば回避できる。
li{ display:inline; }
li img{ display:block; }
li img{ display:block; }
まず最初に<li>に対して、display:inline;をかけて、その後にその中に含まれるimgに対して、display:blockを適用する。
そうすると、<li>はinlineだけど、<img>はblockであ〜と・・結局、blockじゃん！なんだこれ！？みたいな感じになって、
いい感じになって、IE6でも他のブラウザ同様意図した見え方になる。
素敵な回避方法！！！