Multiple :selectors on one CSS element?
I am stylizing a CSS element, and I was wondering if I could use multiple
:selectors on one CSS element.
Because, when I want the
p to be hovered over, I want the
:after selector to also be called.
That specific example is completely valid, it works as demonstrated here.
As of now, the main limitation(s) pertaining to pseudo elements, is that:
CSS3 Selectors - 7. Pseudo-elements (reference)
Only one pseudo-element may appear per selector , and if present it must appear after the sequence of simple selectors that represents the subjects of the selector. Note: A future version of this specification may allow multiple pseudo-elements per selector.
Thus, neither of the following selectors would work:
There is no limit on the number of simple selectors that can be chained together within the selector. And as @BoltClock states in the comments, there can only be one type selector or universal selector.
CSS3 Selectors - 4. Selector syntax (reference)
A sequence of simple selectors is a chain of simple selectors that are not separated by a combinator. It always begins with a type selector or a universal selector.
Here is a relevantly long selector that works: (example)