Question

Are there containers for CSS Selectors?

I’m simply curious if there’s a more elegant way to do this without repeating the class:

#div1 .divClass, #div2 .divClass { color:cyan; }

This is what I had in mind, but I don’t think there’s a way to do it.

#div1,#div2 > .divClass { }
[#div1,#div2] .divClass { }

Answer 1

Short answer: No.

It seems a case where you can add a class for both divs.

<div id="div1" class="sharedClass"></div>
<div id="div2" class="sharedClass"></div>

.sharedClass > .divClass { color: cyan; }

Anyway, this question can have multiple answers. Consider looking at LESS, which extends CSS capabilities. Then you could do something awesome like this:

.divClass {
    /* ... */
}

#div1 {
    color: red;
    border: 1px solid blue;
    .divClass;
}

#div2 {
    color: cyan;
    border: 1px solid green;
    .divClass;
}