Grouping css selectors

Question

Is it possible to group two selectors so that an element is matched only if both selectors are satisfied? For example, if I want the element to satisfy both the selectors .a>.b~.c and .d~.e, is it possible to write a selector that matches the intersection of these selectors?

Answer 1

If you're using class selectors as in your example, you can chain classes like this:

.a > .b.d ~ .c.e

Selects an element that has both class="c e"
which is a sibling of (i.e. comes, directly or not, after) an element that has both class="b d"
which is a child of some element of class="a"

Or, like this, if you want .c.e to occur after an element that has either class b or d:

.a > .b ~ .c.e, .a > .d ~ .c.e

Selects an element that has both class="c e"
which is a sibling of an element with either class="b" or class="d" (or both)
which is a child of some element of class="a"

Both selectors imply that .b, .d and .c.e are all children of .a. I should also think it gives you the class selector intersection that you're looking for.

Answer 2

No, you cannot do set intersection in CSS selectors. Sometimes you can find a way to combine two selectors into one that solves your specific problem, but I don't think there's a way to combine your two sample selectors.