::-moz-selection, ::selection { } と宣言すると Google Chrome, Opera で宣言ブロックごと無視される

CSS

検証

CSS3 には ::selection という疑似要素があります。
Firefox v3.6.13 では ::-moz-selection と書かなければ動作しないので、以下のように書いてみました。(サンプルページは ::selection Sample)

::-moz-selection, ::selection { color: black; background-color: white; }

これは Firefox v3.6.13 では動作しますが、 ::-moz-selection を解釈できない Google Chrome 8, Opera v11.00 では動作しません。
そこで宣言ブロックを2つに分けてみます。(サンプルページは ::selection Sample)

::-moz-selection { color: black; background-color: white; }
::selection { color: black; background-color: white; }

これで Google Chrome 8, Opera v11.00 でも動作するようになりました。

CSS 仕様

CSS 2.1 gives a special meaning to the comma (,) in selectors. However, since it is not known if the comma may acquire other meanings in future updates of CSS, the whole statement should be ignored if there is an error anywhere in the selector, even though the rest of the selector may look reasonable in CSS 2.1.

CSS2は，選択子のコンマ(,)に特別な意味を与える。しかし，コンマがCSSの将来の版で他の意味をもつかどうかは分からないので，選択子のどこかにエラーがある場合には，選択子の残りがCSS2の規定に合っているように見えても，そのすべての文を無視するほうがよい。

Google Chrome 8, Opera v11.00 はこの原則に従っているのだと思います。

Twitterログ


think49
CSSセレクタでベンダー接頭辞を使った場合、他のセレクタが有効に動作するものであっても読み飛ばされるのは の仕様なんだろうか？
1月22日 8:50 PM
think49
@ ::-moz-selection, ::selection を指定すると、Firefox v3.6.13 では動作するが、Google Chrome 8, Opera v11.00 では動作しない。
1月22日 8:53 PM
think49
@ ::-moz-selection {} ::selection {} のように分割して宣言すれば Google Chrome 8, Opera v11.00 でも動作する。
1月22日 8:56 PM
think49
@ 同じスタイルを並列して宣言できないので、とても不便。何とかならないものだろうか…？
1月22日 8:57 PM
∀⊄∩ ⋎ ⊁οωο⊥
@ セレクタをカンマ , で区切ればいいと思うのですが、接頭辞があると上手くいかないんですかね？？
1月22日 9:00 PM
think49
@ 私もカンマで区切れば良いと思ったのですが、そうすると "-moz-" を解釈できないブラウザでは該当ブロックが読み飛ばされたかのような振る舞いをします…。
1月22日 9:09 PM
think49
quirksmode では分割して宣言する Testsheet があった。他にもいくつかのサイトでカンマを使用していないことを確認。
1月22日 9:24 PM
think49
ベンダー接頭辞は CSS2.1 で規定されているが、パースエラー時の処理はここには書かれていない。
(CSS2.1)
1月22日 9:30 PM
think49
@ CSS2.1-4.2 で「構文解析エラー処理のための規則」が規定されている。
(CSS2.1 原文)
(CSS2.0 和訳)
1月22日 9:33 PM
think49
"Malformed statements", "At-rules with unknown at-keywords" が状況的には近い。
::-moz-selection {} と記述されている場合、Fx 以外のブラウザは宣言ブロック全てをパースエラーとして無視する。
1月22日 9:37 PM
think49
[CSS2.1] 4.1.7 Rule sets, declaration blocks, and selectors
(CSS2.1 原文)
(CSS2.0 和訳)
1月22日 9:41 PM
think49
"However, since it is not known if the comma may acquire other meanings in future updates of CSS, the whole statement should be ignored ..."
1月22日 9:44 PM
think49
@ カンマでセレクタを並列する場合、セレクタのどこかにエラーがある場合は他のセレクタが CSS2.1 の規定通りであっても全てのステートメントを無視すべきである。(SHOULD)
1月22日 9:46 PM
think49
@ MUST ではないものの SHOULD にも強い意味が込められているので、Google Chrome, Opera はこの規定に準拠しているのだと思う。
1月22日 9:47 PM