CSS3で大幅に強化されているtext-decorationの実装状況を調べたLine Decoration (CSS3 Text)を見た時に、あんまり関係ないですがtext-shadowとtext-decorationが組み合わさったらその飾りの影は付くのか付かないのかという疑問が湧きました。テストしてみたらブラウザーによって違ったという話です。
Demo: text-decoration and text-shadow
Chrome 15.0.874.120 mやSafari 5.1.1、Firefox 8.0だと下線の影も作られますが、Opera 11.52では下線の影ができません。Internet Explorer 9.0.3は……対応してないので関係無いですね！ バグ……な気もしますが、ちょっと判断が難しいところ。
この現象をチェックしていた時に気づいたんですが、text-shadowで作られる影が場合によってレンダリングが変わるという別の現象もあるようです。
Demo: text-shadow rendering
今度はChrome 15.0.874.120 mでtext-shadowの色としてrgba()等で透明度を付けた場合のみ起きる現象です。よく見ればわかると思いますが文字のアンチエイリアシングが無効になってギザギザになっていることと思います。同じWebKitのSafari 5.1.1を含め他のブラウザーではそういったことは起こりません。まぁ通常はぼかしを使うことと思うので、ギザギザが目立ってひどいというような事にはならないでしょうが、text-shadowを使って文字を立体的にするようなテクニックなどではちょっと引っかかるかもしれないですね。
普通に書けばいつでもどこでも普通に表示されるみたいな世界が近づいてきたとか夢だった。とかはさすがに悲観的すぎますけど、そういう世界が来るのはまだまだ先の話な感じですね。こういうブラウザーの実装の細かい違いもそうですけど、最近はハードウェア・アクセラレーションの有無で大きく描画異なるようなケースあったりとか、実に多種多様でチェックするのが難しい違いがWebの世界にはあふれています。ブラウザー程度は用意できてもハードウェアやグラフィックス・ドライバーのバージョン違いまで用意するのはさすがに無理がある所がほとんどでしょう。各ブラウザー・ベンダーにはWebサイトを訪問したらグラフィックス・ドライバーの更新を求められた……などという悪夢のような出来事が起こらないように頑張って欲しいものです。
CSS Text Level 3の2011-09-01のWDのtext-shadowの説明では以下のように書かれています。
This property accepts a comma-separated list of shadow effects to be applied to the text of the element. <shadow> is the same as defined for the ‘box-shadow’ property except that the ‘inset’ keyword is not allowed. The shadow is applied to all of the element's text as well as any text decorations it specifies.
下線を含めた傍点(text-emphasis)等の全ての装飾に影が付くことが想定されているようですね。