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 Pseudo-Classes

david strayer
david strayer
2,712 Points

Do not understand this challenge...

I do not know what I am doing wrong

style.css
a:link {
color: orange;
}

a:visited {
    color: steelblue;

 a:hover {
    color: tomato;
 }
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>
    <h3>From Tents to Resorts</h3>
    <p>
    Lake Tahoe is full of wonderful places to stay. You have the ability to sleep in the outdoors in a tent, or relax like a king at a five star resort. Here are our top three resorts:
    </p>
    <ul>
      <li><a href="#">Lake Tahoe Resort Hotel</a></li>
      <li><a href="#">South Lake Tahoe Resorts</a></li>
      <li><a href="#">Tahoe Ski Resort Lodging</a></li>
    </ul>
  </body>
</html>

11 Answers

Hey David,

You're missing an ending } after your a:visited selector.

a:link {
 color: orange;
}

a:visited {
 color: steelblue;
}

 a:hover {
  color: tomato;
 }
Jason Anders
Jason Anders
Treehouse Moderator 145,858 Points

Hey Marcus, How do you post the nice black square with the code all formatted and colored properly?? I've seen most like that and some where the code is just written out in normal type.

Black box much easier to read. ???

Go by the code block in the image below. Where you see "css" can be just about any web language i.e. "html", "javascript", "css", "php", etc. Also, be sure to leave a blank space ABOVE the first 3 backticks and BELOW the last 3 backticks.

code

Jason Anders
Jason Anders
Treehouse Moderator 145,858 Points

Thanks Marcus, I'll have to try that next time I use the forum. :)

Thanks, Jeff! lol

Jason Anders
MOD
Jason Anders
Treehouse Moderator 145,858 Points

You simply missed a closing } (curly bracket) for you a:visited setting.

Hi David,

Check to make sure you closed the bracket at the end of the :visited pseudo-class. See if that doesn't solve the issue. Good luck!

Ronald

david strayer
david strayer
2,712 Points

it was a problem with the 3rd one, tomato.

this was the challenge: Finally, add a new pseudo-class selector that targets all links on hover. Add a color property and set the value to tomato.

this was the "problem": Make sure you're targeting links on ':hover', and setting the color to 'tomato'.

No, it was a problem with a missing }. The 2nd task lets you go forward without an ending }, and then the compiler doesn't know what to do when there are not enough } in the correct places. Your code was originally correct except for the missing }.

Gaby Khoe
Gaby Khoe
23,462 Points

You are missing a closing curly brace }

a:visited { color: steelblue; }
david strayer
david strayer
2,712 Points

okay well i have a curly brace and it still does not work

Well, I literally redid the challenge using your exact code with a } after the rule inside the a:visited selector and it works just fine.

david strayer
david strayer
2,712 Points

thanks for everyone's help :D,

it didn't work the first time but I started over and it seemed to work -_-

david strayer
david strayer
2,712 Points

how come for this first challenge (1/3) it did not need the end }?

If you have just the one selector (or the missing } comes at the end), it doesn't need a } technically, but once you add more selectors after that, you need a } to separate the selectors.

It's okay man. No problem.

a:visited { color: steelblue; }

Note: Don't get confused with the word "all", in the question.

Jackie Santana
Jackie Santana
7,403 Points

THIS TOOK ME 30 MINS TO FIGURE OUT.. YOU ARE WRITING THE CORRECT CODE BUT THEY WANT YOU TO POST THE PREVIOUS CODE YOU WROTE BEFORE LIKE a:link { color: orange; }

a:visited { color: steelblue; AND THIS WILL WORK.

After reading through all the answers on this question then come to your comment in ALL caps, I initially was just going to skip over your brilliant synopsis, but by being in all caps in also brought my attention to your words. I read, thank you! The practice session does not give the impression you need to deploy both rules in the same text box.

If it weren't for you, I'd be lost! LOL! Thanks.