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 Selectors

Daphne Lc
Daphne Lc
3,709 Points
Posted by Daphne Lc
Daphne Lc
3,709 Points

top id

For the top id to work I had to put #top in the header section too. It didn't work with only top?

Jessica Barnett
Jessica Barnett
8,028 Points
Jessica Barnett
Jessica Barnett
8,028 Points

Post your code please! : )

6 Answers

Wayne Priestley
Wayne Priestley
19,579 Points
Wayne Priestley
Wayne Priestley
19,579 Points

Hi Daphne,

Looking at the code in your footer it looks like you have a link there to take the user back to the top of the page.
Your footer code is fine, but the code in your head section i would move to the header, and remove the # like you said you tried earlier. It should work fine there.

<header>
<div id="top"></div>
</header>

Hope this helps.

Jessica Barnett
Jessica Barnett
8,028 Points
Jessica Barnett
Jessica Barnett
8,028 Points

No need to be sorry! I just haven't done these courses in a while so I don't know what question you're talking about, or what you need, without a little more context. No worries.

so, you assign an id like so: 

<div id="my-id-name">
</div>

and then in your css you can do this

#my-id-name {
  //styles go here
}

classes are similar and look like this:

html: 

<div class="my-class-name"></div>

css:

.my-class-name {
    //styles go here
}

IDs and classes are sort of like names you give your elements, so you can reference them in your css. The difference between them is that classes can be used many times, while IDs can only be used once on a page.

So, what you did here...

<a href="#top">Back to top &raquo;</a>

Is not adding an id.

You want to do it like I did it at the top of this post.

Fun fact. This IS actually valid html! If you had an element on the page with id="top", that link would jump to it. So if you had a long story with a lot of chapters on a single page, and you wanted to jump to the chapters using links, that's how you would do it.

But I think that's not what you're going for. That question is just looking for you to add an id to a div, and then select it in your css. Much less complicated. : )

Does that help?

Dave Lawlor
Dave Lawlor
2,732 Points
Dave Lawlor
Dave Lawlor
2,732 Points

Excellent - really helpful, thanks.

Daphne Lc
Daphne Lc
3,709 Points
Daphne Lc
Daphne Lc
3,709 Points

sorry 

  <head id="#top">
    <title>Lake Tahoe</title>
    <link rel="stylesheet" href="css/style.css">
  </head>

<footer>
            <p>All rights reserved to the state of <a href="#">California</a>.</p>
            <a href="#top">Back to top &raquo;</a>
        </footer>
Daphne Lc
Daphne Lc
3,709 Points
Daphne Lc
Daphne Lc
3,709 Points

thank you for that I will try that right now :)

Daphne Lc
Daphne Lc
3,709 Points
Daphne Lc
Daphne Lc
3,709 Points

Its exactly what I did wrong thank you

Simon Truong
Simon Truong
2,179 Points
Simon Truong
Simon Truong
2,179 Points

Hello Daphne,

To complete Wayne's reply, selectors can't never be in the <head> tag, which is not part of the <body> tag, which constitutes what you're seeing in your browser window.

Peace,

Simon