[web] IEでli要素間に謎のスペースが入る

HPを作成していたところ、marginやpaddingを指定していないのに、IEで li要素間に謎のスペースが入ってしまう現象に悩んでいた。
調べてみたところ、IEのバグのようだ。
Win版IEにおけるCSSのバグ - ちほちゅう



li要素やli要素の子孫要素の幅が指定されているとリストマークが下方にずれる

というもの

対策は、

  1. liタグ内の文字の大きさをCSSでゼロにする。
  2. liタグ内のimgタグにCSSでvertical-align:topの指定をする。
  3. li要素に display: inline を指定する

上記のページで 1の方法だとスパム扱いにならないかと心配していたが、確かに不安だ。。
今回は2の方法で対応した。
今回は3の方法で対応した。

※2009/2/8 対処法(3)を追加

しかし、IEバグ多杉。
使っている人口が多いだけにタチが悪い。