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 Sharon Weathers
Sharon Weathers
805 Points

decendant selector that targets the span inside the header element. No luck. Tried 4 times.

I can't find what I am doing wrong and I have viewed the video 3 times.

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

}
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 class= "title">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>

4 Answers

Jesse Sanchez
Jesse Sanchez
2,430 Points
Jesse Sanchez
Jesse Sanchez
2,430 Points

gang gang with all y'all goofy selves

Salman Akram
PLUS
Salman Akram
Courses Plus Student 40,065 Points
Salman Akram
Salman Akram
Courses Plus Student 40,065 Points

Hi Sharon,

Create a descendant selector that targets the span inside the header element. Add a font-size property and set the value to 26px.

Let's see HTML files:

  <body> 
    <header>
      <span>Journey through the Sierra Nevada Mountains</span>
      <h1>Lake Tahoe, California</h1>
    </header>
  ....
  ....
  ....

I found header and then span there, let's create called header span since there are no IDs or classes. 

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

Hope that helps.

Tyler Haas
Tyler Haas
20,623 Points
Tyler Haas
Tyler Haas
20,623 Points

The challenge wants u to add the main-header class in the html your css looks great! If u add the class to the html file it should pass the test. Let me know if u need further help.

Sharon Weathers
Sharon Weathers
805 Points

I need further help. I am on question #2 which states "target the paragraph that is a descendant of the main-content class. I am not sure how to update html. What is the phrase and where should it be typed in?

Sharon Weathers
Sharon Weathers
805 Points
Sharon Weathers
Sharon Weathers
805 Points

No it still doesn't work.

Tyler Haas
Tyler Haas
20,623 Points

are you on task 1 of 3? If so the following code worked for me: 

header span {
  font-size: 26px;
}

that task asks you to set the font size to 26px you have it set to 10px;