css Multiple parents with childs

Question

Currently I have the current HTML:

<header>
    <div class="row text-center">
        <h1> text </h1>
        <h3> text </h3>
        <a> text </a>
    </div>
</header>

I want all my header in this class to be white so I made this in CSS:

.row.text-center > h1 h3{
color: #FFFFFF;
}

But the H1 and H3 are still the default colour. Is this not supported in CSS or am I doing something wrong?

@Hashem Qolami Your mark is incorrect the child/descendants work, the parents don't. — 2Keys, Mar 27 '15 at 22:15
It completely matches the question. `I want all my header in this class to be white` this means you want to group the `
` and `
` which are descendants of the `div.row.text-center`. The question is not about the parent/ancestor. Anyway, you could simply set the color on the `
` element itself. All the descendants would inherit that value. — Hashem Qolami, Mar 27 '15 at 22:25

score 1 · Accepted Answer · answered Mar 27 '15 at 22:03

1

in your code, you assign at h3 inside h1.

you have to use:

.row.text-center > h1,.row.text-center > h3{
  color: #FFFFFF;
}

answered Mar 27 '15 at 22:03

cesare

Why do .row.text-center > h1 and .row > h1 h3 work, but does .row.text-center > h1 h3 not? – 2Keys Mar 27 '15 at 22:17
if you don't divide rules with a "," it consider all selectors nested. So .row.text-center > h1 h3 means the color white is applied at the h3 that is son of h1 that is son of .row.text-center – cesare Mar 27 '15 at 22:20

` and `