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

James Eden
James Eden
1,539 Points
Posted by James Eden
James Eden
1,539 Points

Bummer! Is this a glitch or am I wrong?...

Challenge:

"Create a new rule using the selector that targets an element only if its ID matches the hash in a URL. Set the background color to tomato."

I've got:

:target{
  background-color:tomato;
}

Thanks... J

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Could you post a link to the code challenge you are having issues with. Without a link to the code challenge you are having issues with someone would have guess which one it is, to be able to test out their solution.

4 Answers

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Your code passes fine, my guess is you put the code in the index.html tab of the code challenge instead of the styles.css tab.

I'd guess that it's a bug in the code challenge correctness check that marked the first step correct but the second for your internal styles. At the end of everyone code there's a give feedback button where you can let Treehouse know about issues like this that tripped you up.

James Eden
James Eden
1,539 Points
James Eden
James Eden
1,539 Points

Right! Thanks James. I've missed the tabs and used internal css. I'll try again.

J

James Eden
James Eden
1,539 Points
James Eden
James Eden
1,539 Points

I'll copy the whole thing here if it helps...

'''html <!DOCTYPE html> <html> <head> <title>More Pseudo-classes</title> <link rel="stylesheet" type="text/css" href="page.css"> <link rel="stylesheet" type="text/css" href="style.css"> <style type="text/css"> :root{ background-color:lightblue; } :target{ background-color:tomato; } <style> </head> <body> <ul> <li><a href="#s1">Section 1</a></li> <li><a href="#s2">Section 2</a></li> </ul>
<div id="s1"> <h2>Section 1</h2> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex. </div> <div id="s2"> <h2>Section 2</h2> Integer laoreet urna ut est cursus nec tristique elit vestibulum. In hac habitasse platea dictumst. Quisque pharetra odio nec urna lobortis sed ultrices dolor posuere. Sed nec nisl id augue congue euismod. </div> </body> </html> '''

James Eden
James Eden
1,539 Points
James Eden
James Eden
1,539 Points

Ahhh...

<!DOCTYPE html>
<html>
<head>
    <title>More Pseudo-classes</title>
    <link rel="stylesheet" type="text/css" href="page.css">
    <link rel="stylesheet" type="text/css" href="style.css">
  <style type="text/css">
    :root{
      background-color:lightblue;
    }
    :target{
      background-color:tomato;
    }
  <style>
</head>
    <body>
        <ul>
            <li><a href="#s1">Section 1</a></li>
            <li><a href="#s2">Section 2</a></li>
        </ul>       
        <div id="s1">
            <h2>Section 1</h2>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
            tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
            quis nostrud exercitation ullamco laboris nisi ut aliquip ex.
        </div>
        <div id="s2">
            <h2>Section 2</h2>
            Integer laoreet urna ut est cursus nec tristique elit vestibulum. In hac 
            habitasse platea dictumst. Quisque pharetra odio nec urna lobortis sed 
            ultrices dolor posuere. Sed nec nisl id augue congue euismod. 
        </div>
    </body>
</html>