:first-letter と :hover の微妙な関係

ちょっとバグ？発見。長い文章を読むときに、ずっと同じ大きさの文字だと段落で区切ったとしてもなんとなく目が疲れる。それを解消するためにありがちな、段落の最初の文字を大きくして色を変えるなんて事をやろうと思って、CSS の first-letterプロパティ を用いようとしています。ただやはりブラウザの CSS対応状況によって仕様が異なるので使い難いのです。と言う訳で既知だと思いますがいくつか気が付いた物を。

• IE ではプロパティと { の間に半角スペースを入れなければ正しく認識しない。
• IE では first-letterプロパティ を用いた要素で padding や margin を用いる場合、先頭の文字を基準に考えるのか、単位に em を用いると意図しない形になる。
• first-letterプロパティ を用いた要素内で、その先頭がリンクの場合、:hover を用いて background や text-decoration などを指定すると Firefox(Gecko系) ではマウスオーバー時に表示が通常に戻る(first-letterプロパティ が失われる？)。

とりあえずこんな所です。上記二つは解決策があるが、三つ目 についてはなかなか痛い。段落の先頭にリンクを持ってこなければ良いのだが、そういう訳にもいかない。見出しのリンクで first-letterプロパティ を使用したいと思うことは多々ある。解決策は ないことはない らしいが、やはり いまいちスッキリしない。書かれた記事の日付から考えるとそろそろどこかで解決されててもおかしくなさそうなのですが、どうなのでしょうか。

試行錯誤の結果。個人的であやふやな方法ですが、見出しの方はなんとかなったようです。ただ、段落の方は line-height や letter-spacing を調整してみても“ピコピコ”点滅したりします。display:none; にしてみたりしてみましたが駄目でした。なにか有効な回避方法がありそうなのですが見つかりません。