IE6、IE7でのliの扱い。

サイト製作時に別の作業者のところで発生した問題。
IE6とIE7で

～

が消えてしまうというものでしたが、いろいろ調べた結果、親要素に「text-indent:-9999px」が指定してあったことが原因と分かりました。

1つ上の

に設定していたのではないのですが、継承されて影響したようです。 しかし、text-indentで位置が変わってしまうと言うことは、IE6/7では、
• はインライン要素として処理されているということです。
  FireFox、Opera等では意図通りだったため、これらのブラウザではブロックレベル要素扱いになっていたと言うことです。
  
  さて、これはどういうことか。
  
  どうもこの辺のHTMLの定義が、曖昧なようなのですね。
  他にもtableの子要素のなども、インラインなのかブロックレベルなのかよく分からない。リストとテーブルが怪しいですね。
  
  
• に関しては、新しいブラウザではブロックレベル要素と扱われているようなので、一般的にはそっちに分類されるのだろうか。
  
  まぁ、こういうことになってしまっているのは仕方ないし、そうなってしまった経緯とか、本来どうあるべきなのかは興味ないです。僕ら製作者としては現象が全てなので、意図通りに表示されれば何でも良いです。
  そんなわけで僕自身は基本的に
• は「display:block」を指定して、明確にブロックレベル要素として設定するようにしています。