Combining Elements in CSS

Question

How can I combine elements in my CSS? Here's what I've got now:

#someID .some-class h1 {
    color: blue;
}

#someID .some-class h2 {
    color: blue;
}

#someID .some-class h3 {
    color: blue;
}

and what I'd like to do is something like this:

#someID .some-class h1 h2 h3{
    color: blue;
}

I highly recommend you to read some CSS tutorial. As your question is basic syntax question [read here](https://www.w3schools.com/css/css_syntax.asp) — bugwheels94, Apr 06 '17 at 18:42
Possible duplicate of [css multiple class / id selectors?](http://stackoverflow.com/questions/3458169/css-multiple-class-id-selectors) — trincot, Apr 06 '17 at 20:55

score 0 · Answer 1 · answered Apr 06 '17 at 18:38

0

Separate the whole selector group with a comma:

#someID .some-class h1, #someID .some-class h2, #someID .some-class h3 {
    color: blue;
}

answered Apr 06 '17 at 18:38

sn3ll

1,619
1
10
16

I was sure that I tried that method... It worked. Thanks for the quick answer! – Sean Robertson Apr 06 '17 at 18:42

score 0 · Answer 2 · answered Apr 06 '17 at 18:39

0

In pure CSS you'll just have to list all the selectors separated by commas. Note that, again in pure CSS, you'll have to include the whole thing even if part of it is the same.

answered Apr 06 '17 at 18:39

Roope

4,325
2
25
50

score 0 · Answer 3 · answered Apr 06 '17 at 18:39

0

With Commas

#someID .some-class h1, #someID .some-class h2,#someID .some-class h3{
    color: blue;
}

answered Apr 06 '17 at 18:39

camccar

682
10
23

score 0 · Answer 4 · answered Apr 06 '17 at 18:44

0

I would target the class instead of id and class. Here is a working example JSFiddle

.some-class h1,
.some-class h2,
.some-class h3 {
  color: white;
}

answered Apr 06 '17 at 18:44

scarsam

326
1
12

Combining Elements in CSS

4 Answers4