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

Posted by Cameron Monzon
Cameron Monzon
7,115 Points

What is the difference between these two selectors: . #

Up to now we have mainly used the # selector in CSS. In what cases do we use the . selector?

David Lewis
David Lewis
1,365 Points 
You use the # to style a HTML tag with an id such as: 

<div id="foo"></div>

#foo {};

You use a . to target a tag by its class:

<div class="foo"> 

.foo {};

2 Answers

SABCD ABCD
SABCD ABCD
3,414 Points
SABCD ABCD
SABCD ABCD
3,414 Points

Hi Cameron,

If my understanding of your question is correct, you are asking what the difference is between # (which is an id selector and . (which is a class selector).

Both of them are used to target specific parts of the code. However, the difference is that a # (id) is unique and can only be used once, whereas a . (class) can be used multiple times on different parts of code.

You use a . selector when you want to style multiple elements with with the same css code.

For example, if you want to style the header and footer the same way (using the exact same css code) then you would use the . selector.

If you want to know more about this, here is a simple explanation http://css-tricks.com/the-difference-between-id-and-class/

Bruce Berdine
Bruce Berdine
13,607 Points
Bruce Berdine
Bruce Berdine
13,607 Points

Hey Cameron,

I had the same question. You may find this helpful. http://www.w3schools.com/css/css_selectors.asp