Nesting With Child Selectors

by Marius Craciunoiu

HTML

<section>
    <span>
        section > span
    </span>
</section>

<section>
    <div>
        <span>
            section > div (stop lookup) > span
        </span>
    </div>
</section>

<main>
    <section>
        <div>
            <article>
                <span>
                    section > div > article (stop lookup) > span
                </span>
            </article>
        </div>
    </section>
</main>

CSS

section > span {
    background: black;
    color: white;
}

body {
    text-align: right;
}