2009年あけおめ。
うちのIE7でGoogleやはてなブックマークを見ると、リンク（a要素）の下線が日本語にかかっていたり、ずれていたりする部分が見られる。なんでかな？と思ってググってみたら、IE7限定のUnderlineに関するバグ（infinity-Totonicapan.NET Revision 8-）が見つかった。
なるほど。
こちらでも実験してみたところ、IE6でも発症するバグであること、レアケースっぽいようで、なかなか起きやすそうな事例であることがわかってきた。
IE6/IE7の下線バグのキャプチャ (288 by 268 pixels, 6.69KB)
元記事を参考にしながら、条件を書き直してみた。以下の4つの条件を同時に満たす場合に発症する。
つまり、font-familyで英語用のフォントが指定されているんだけれど、日本語が書いてある、えっと日本語のフォントはなんだっけ、デフォルトは・・・ああメイリオだ、などとIE6/IE7が考えているうちにおかしな表示をしてしまう、ということのようだ。
キャプチャでは、1.は何も指定せず、2.以降にはfont-familyになにかしら指定をしている。vertical-alignはimg要素に指定している。
何のフォントを指定するかで、下線がどこにくるのかが変わってくる。5（ご）は同じ行に半角文字がなくても下線がずれることを示している。6.は逆に、同じa要素の中に日本語と英語を混在しているが、この場合は日本語部分だけずれる。
以上のとおり、条件そのものはきついが、img要素を置いてvertical-alignを指定する場合や、全称セレクタ（*）におまじないでvertical-alignをつけている場合は気にしたほうがいい。私だけでなく、IE7ユーザーでデフォルトフォントをメイリオにしている人はけっこういると思うから。
トラックバックURL: http://adp.daa.jp/cgi/mt2/mt-tb.cgi/781
項目の4番目、主体的にvertical-alignを指定しなくても、注釈/脚注などでよく見かけるsup要素を使った場合なんかでも（vertical-alignが内部的に変更されて）バグ発症のトリガーになるようです。ひどいっすな。