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 CSS Foundations Selectors Using Combinators in Selectors

Posted by Nicole Elliott
Nicole Elliott
2,556 Points

major bummber

In the video, the teacher showed us how to chose a child of main by using:

.main > a {
    color: violet;
}

I should be able to do the same thing here by using:

.div > a{
color: green;
font-weight: bold;
}

but it doesn't seem to be working. What's going on?

5 Answers

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

You have a "." before the word DIV, this will cause it to look for an element with the CLASS of DIV rather than an actual DIV element.

So to fix your issue remove the "." (DOT)

Joe Marion
Joe Marion
5,112 Points

Haha I can't believe I didn't notice that. for some reason I assumed the name of the class was div.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Div is an HTML element, HTML elements are referenced in CSS by their tag name in the case of a <div> element it would be referenced by div.

On the other hand if you want to reference a <div class="main"> you need to reference it via it's class, which requires a dot before the class name.

further reading

Joe Marion
Joe Marion
5,112 Points
Joe Marion
Joe Marion
5,112 Points

Edit: I made a rookie mistake, didn't notice the class selector.

Adam Sackfield
PLUS
Adam Sackfield
Courses Plus Student 19,663 Points
Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Remember these

    .header { // style here } // The DOT targets CLASSES of the name following it in this case CLASS of HEADER.
    #header { // Style here } // The HASH(Pound) target ID's of the name following it in this case ID of HEADER
    header { // Style here } // This will target the element with the name HEADER or in html would look like this <header>   </header>
Nicole Elliott
Nicole Elliott
2,556 Points
Nicole Elliott
Nicole Elliott
2,556 Points

Thanks, guys! I removed the period, and it worked right.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Cool! Choose a best answer to show others it is solved :)