How to change just the css inside a DIV and not anywhere else?

Question

I have this code :

h1, h2, h3, h4{ 
    color: red;
}
.message_rouge h1, h2, h3, h4,{color: black;}

Why are ALL my headers black instead of just the ones inside "message_rouge" and the rest red?

Thanks :)

Answer 1

Each line is it's own selector, but you're only specifying .message_rouge on the first one.

Use this instead:

.message_rouge h1, 
.mesage_rouge h2,
.mesage_rouge h3,
.mesage_rouge h4 {
    color: black;
}

Answer 2

This is wrong

.message_rouge h1, h2, h3, h4,{color: black;}

This is right

.message_rouge h1,.message_rouge h2,.message_rouge h3,.message_rouge h4,{color: black;}