Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Konrad Pilch
Konrad Pilch
2,435 Points

When to use > ?

When to use > ?

Konrad Pilch
Konrad Pilch
2,435 Points

Tobias Helmrich

Hi, can you paste your answer here? So i can give a best answer and at least it can be usefull on when i write, as well as others, this title in google.

1 Answer

Tobias Helmrich
Tobias Helmrich
31,604 Points

Hey Konrad,

sure! :) Here it is:

this would be a really simple and not really useful example but I hope it helps you to understand it:

<div class="wrapper">
    <div class="nested-div">

    </div>
    <div class="nested-div">

    </div>
    <div class="sub-wrapper">
        <div class="nested-div">

        </div>
    </div>
</div>

I have five div container in this example. One container that contains all the others with the class of wrapper. Inside there are three div container with the class of nested-div and one with the class of sub-wrapper which contains one of the div containers with the class of nested-div.

If I would write

.wrapper .nested-div {
  background: blue;
}

now, all the divs with the class of nested div inside the wrapper would become blue. However if I write

.wrapper > .nested-div {
  background: blue;
}

instead, only the two divs with the class of nested-div that are direct children of the wrapper (so not nested inside of any other elements, in particular not the child of sub-wrapper) would have a blue background. The one nested inside of the div with the class of sub-wrapper wouldn't change because it's not a direct child. I hope that helps! :)

Konrad Pilch
Konrad Pilch
2,435 Points

Thank you ! :)

Tobias Helmrich
Tobias Helmrich
31,604 Points

No problem, glad I could help! :) I also fixed the bad formatting just now, sorry for that!