404

Mozilla 5.0 系の CSS バグ。

:first-letter擬似要素に設定したスタイルが動的擬似クラスにマッチすることで失われる

フロート化していない:first-letter擬似要素にスタイルが設定された要素が動的擬似クラス（:hoverなど）にマッチすると、擬似要素に設定したスタイルが失われてしまう。

MT 2.661 使用時から各エントリーのタイトル（h3 要素）に first-letter で装飾を施したスタイルを使用していて、トップページやカテゴリアーカイブのインデックスページからはその h3 要素内のテキストを a 要素として各エントリーへリンクさせているのだけれど（微妙な表現だけれど大丈夫ですかこれ）、前述のバグによって Mozilla では a 要素へマウス乗せたあとには first-letter による装飾が解除されるようになっていた。のだけれど、MT 3.1 移行後には解除されてないなそういえば、ということを思い出して cho45(砂糖) 氏 にも同様の現象が起こっていることを確認してから IM でふっかけてみた。

で、疑問は一応解決した。first-letter で装飾されている要素（内テキスト）が hover 時に after で擬似要素を追加していれば、first-letter による装飾は解除されない様子。今は h3 に first-letter で装飾を施していて、after で擬似要素を追加しているのは h3 要素の中にある a 要素だから、もしかしたらちょっとこれとは表現を変えた方がいいのかも知れないけれど。

という実証があるのですが、論理的に原因を導くというようなことはできてなどいないので（他に対処方法があるかどうか、という点も未確認）、「つまりこれこれこういう要因があってこうなるのだ」ということを理解し広めることのできる方の登場を待ちわびてここに記録を残すものとします。如何せん眠い。