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!
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
Chloe Brittain
Courses Plus Student 2,082 Points.class element vs element.class
Hi,
The CSS selectors videos talked about descendant selectors, like ".my_class a", but (I could be mistaken) I don't remember them talking about element.class, like "a.my_class". However, I just had to use the latter to get a question right in objectives for "Relative Length Units". I don't understand what the difference between these two is.
6 Answers
Adam Sackfield
Courses Plus Student 19,663 PointsYes there is a difference
.class nav
will select all nav that are a descendant of a class name .class
nav.class
will select all nav elements with the class named .class
Hope this clear it up
James Barnett
39,199 Points.container div
"Select any div element that is a child of any element with a class name of "container"
div.container
"Select any div element that has a class name of "container"
Paul Graham
1,396 Points.class x targets any element x that's a descendent of a class
x.class targets only those x elements assigned that class
Kevin Niedermayr
3,072 PointsI could be wrong but a.my_class actually means that you want the link only in .my_class to be styled and if you use .my_class a it will add the styling to all the link elements in .my_class (there could be another div, and another). Haven't really thought about that until now, just did it that way.
Adam Sackfield
Pro Student 19,663 Pointsa.my_class
will style ONLY the anchor tags with the class name .my_class like
<a href="#" class="my_class">Link Affected</a>
so the following would not be selected
<section class="my_class">
<a href="#">Link not Affected</a>
</section>
Thanks
Kevin Niedermayr
3,072 PointsAh yeah, sounds right, thanks. :) But in a way it's like I meant it.
Chloe Brittain
Courses Plus Student 2,082 PointsThanks, this visual helped a lot.
Wayne Priestley
19,579 PointsHTML reads from right to left.
so .div a would target the a tag that was contained within a div element.
and a.div would target the div that was contained within the a element.
Don McIntosh
6,525 PointsI'm pretty sure that ".my_class a" selects an anchor tag (a) inside any parent or other ancestor that is of class my_class, but "a.my_class" selects any anchor tag that is of class my_class.
Don McIntosh
6,525 PointsDon McIntosh
6,525 PointsI'm pretty sure that ".my_class a" selects an anchor tag (a) inside any parent or other ancestor that is of class my_class, but "a.my_class" selects any anchor tag that is of class my_class.