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
Misty Majewski
5,276 PointsBummer! Please use the ampersand selector following the selector for the footer div.
p { a { color: red; .footer & { color: purple; }
a { color: blue; &:hover { opacity: 0.5; } } }
I'm sure what I am doing wrong. I am suppose to be adding an exception to the div with a class of footer and I have to use the post-selector ampersand?
6 Answers
Jason Anello
Courses Plus Student 94,610 PointsThe order in your original code is correct. The & has to come after div.footer so div.footer & is correct.
The compilation error is because you are missing a closing curly brace.
You didn't properly close your first a selector.
I didn't catch that the first time around.
Adam Sackfield
Courses Plus Student 19,663 PointsShould be this.
p {
a {
color: red;
}
& > a {
color: blue;
&:hover {
opacity: 0.5;
}
}
}
Adam Sackfield
Courses Plus Student 19,663 PointsYes I see. Think I got lost in the nesting there. I do believe the poster has the wrong order as I did the quiz when saw the post and my answer was correct up to challenge 3. So it just need the & .footer adding before the last } in my example. Unless I am going insane which is a very real possibility :)
Jason Anello
Courses Plus Student 94,610 PointsHi Misty,
They want you to be more specific with your selector. It's a div with a class of .footer
Use div.footer
Adam Sackfield
Courses Plus Student 19,663 PointsIf this is the case I believe all you need to do is swap the '.footer' and the '&' around
Jason Anello
Courses Plus Student 94,610 PointsWouldn't that reverse the parent/child relationship though?
If you put the & first then it would be selecting .footer elements that are inside of an a tag that is inside of a p tag.
Jason Anello
Courses Plus Student 94,610 PointsIt looks like you lose your comment if you try to edit it.
I wanted to add that the final css output for that part should look like:
div.footer p a {
color: purple;
}
Misty Majewski
5,276 PointsI tried the div.footer p a.. it said it was not a nested rule.. When I tried div.footer & it said it was a compilation error. I am so confused. Watched video again but it didn't cover anything like this.. Any other suggestions?
Misty Majewski
5,276 PointsI also tried swapping the footer and the & around.. Maybe I am putting in the wrong spot?
Misty Majewski
5,276 PointsThanks it worked... I have learned a lot trying to figure out that challenge.. Thank you for your help!!
Adam Sackfield
Courses Plus Student 19,663 PointsI believe that is the best way to learn, by trying something and working through your errors. I am learning Rails and this approach seems to work.
Jason Anello
Courses Plus Student 94,610 PointsYou're welcome.