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 Basics (2014) Basic Selectors Descendant Selectors

Posted by Shayla Mayer
Shayla Mayer
2,867 Points

Challenge 3

Part 3

style.css 
/* Complete the challenge by writing CSS below */
header span {
  font-size: 26px;
}

.main-content p {
  font-weight: bold;
}

footer span {
  color: slategrey;
}
index.html 
<!DOCTYPE html>
<html>
  <head>
    <title>Lake Tahoe</title>
    <link rel="stylesheet" href="page.css">
    <link rel="stylesheet" href="style.css">
  </head>
  <body> 
    <header>
      <span>Journey through the Sierra Nevada Mountains</span>
      <h1>Lake Tahoe, California</h1>
    </header>
    <p>
      Lake Tahoe is one of the most <span>breathtaking attractions</span> located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation.
    </p>
    <a href="#">Find out more</a>
    <div class="main-content">
      <h2>Check out all the Wildlife</h2>
      <p>
        As spawning season approaches, the fish acquire a humpback and protuberant jaw. After spawning, they die and their carcasses provide a feast for gatherings of mink, bears, and Bald eagles.
      </p>
      <a href="#">See the Wildlife</a>
    </div>
    <footer>
      <p>All rights reserved to the state of <a href="#">California</a>.</p>
    </footer>
  </body>
</html>
Ariel Aronica
Ariel Aronica
6,646 Points
Ariel Aronica
Ariel Aronica
6,646 Points

It looks like you have a footer span selected in your CSS, but I see no footer span in your html. What is the question asking you to do exactly?

2 Answers

Tomy Lim
Tomy Lim
4,571 Points
Tomy Lim
Tomy Lim
4,571 Points

Greetings Shayla,

For step 3, it is asking you to select the descendant of the footer. The element you want to select is the paragraph <p> inside the footer. In order to do that you must do this:

footer p { color: slategrey; }

Think of selecting the parent element first then work your way down.

Keep going at it, you're doing great!

From,

Tomy

Jeff Jacobson-Swartfager
Jeff Jacobson-Swartfager
15,419 Points
Jeff Jacobson-Swartfager
Jeff Jacobson-Swartfager
15,419 Points

In the last question, you are looking to target a paragraph that is a descendant of the footer element.

Your CSS is targeting the span element that is a descendant of the footer instead. Correct that, and you should pass.