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 ID and Class Selectors

Give the header element a class attribute. Then, set the class value to main-header.

Can someone please help me? I've been stuck on this question for a week and just don't understand. Thank you.

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 breathtaking attractions 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>
      <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>
  </body>
</html>
style.css
/* Complete the challenge by writing CSS below */
<header class = "main header">

3 Answers

This is what I did and it's still wrong. I'm getting extremely frustrated.

<!DOCTYPE html> <html> <head> <title>Lake Tahoe</title> <link rel="stylesheet" href="page.css"> <link rel="stylesheet" href="style.css"> </head> <body> <header> <header class = "main header"> <div header = main header"></div> <span>Journey through the Sierra Nevada Mountains</span> <h1>Lake Tahoe, California</h1> </header> <p> Lake Tahoe is one of the most breathtaking attractions 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> <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> </body> </html>

Jamie Reardon
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer

You have added a new opening header element inside the header element itself. Remove that. If you are unsure what part of the code I mean, here is a snippet of it:

<header class = "main header">

Before this piece of code is an already existing opening header element tag:

<header>

Add the class attribute and value inside of this one, don't create a new element tag.

Jamie Reardon
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer

Your on the right tracks, except, when adding an attribute such as a class to an element, that is added to the html markup, not the css. So all you need to do is add the class and value to the html header element.

I figured it out. Thanks!