htmlcssfirefoxinheritancepseudo-element

Selection inheritance (::selection, ::-moz-selection)


I can't understand the way ::-moz-selection pseudo element is inherited. What I mean: is it possible that if I will apply ::-moz-selection to body tag

body::moz-selection {
  background: red;
}

It will also apply to say paragraph (<p>) inside body tag? I found this http://dev.w3.org/csswg/css-pseudo-4/#highlight-cascade

This could alternately be described in terms of inheritance. The observable differences would be in how inherit and unset behave. Should it inherit from the parent ::selection or the originating element? Opera does the former, Gecko/Blink the latter.

I don't quite understand what means 'originating' element ('parent' seems to be clear to me) and the way this inheritance works.


Solution

  • In CSS, the originating element of a pseudo-element simply refers to the element that the pseudo-element is attached to. For example, in the selector body::selection, the originating element is the body element.

    That note is saying that in Opera (Presto), the ::selection pseudo-elements of child elements inherit their styles from the ::selection pseudo-elements of their parents, whereas in Gecko and Blink, they inherit from their originating element only (which is the standard behavior for all existing CSS1 and CSS2 pseudo-elements).

    It would seem that the cascading behavior of multiple ::selection styles is well-defined: take the innermost declarations. But inheritance is a sticking point, especially considering the conflicting implementation behavior. In particular, if color: inherit were specified on ::selection, should this value be taken from the originating element's color (behaving exactly like currentColor), or should it be taken from its parent's ::selection?