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

Jacob Tennyson
Jacob Tennyson
6,240 Points
Posted by Jacob Tennyson
Jacob Tennyson
6,240 Points

#id selectors?

So if i want to use an #id selector say for my div element on my html page then i can no longer use an #id selector for any other div elements for that page or if i wanted to use an #id selector for another div element could i just change the name? Whats the benefit of using #id selectors? Isn't it just as easy to just use a a class selector?

3 Answers

bleedcmyk
bleedcmyk
5,945 Points

An additional benefit to using classes over ID's is that you can append multiple classes to the same tag.

<li class="one two three">

can be selected by

.one { }

.two { }

.three { }

Jacob Tennyson
Jacob Tennyson
6,240 Points
Jacob Tennyson
Jacob Tennyson
6,240 Points

Ok. So i couldnt do that with an id selector correct?

bleedcmyk
bleedcmyk
5,945 Points

Nope, it wouldnt target an ID at all if the complete ID in your HTML didnt match up with a complete ID in your css.

Kevin Korte
Kevin Korte
28,149 Points
Kevin Korte
Kevin Korte
28,149 Points

Most of the time classes are the way to go. For me, I leave all of they CSS work to classes only almost always. When or if I use an ID, it's generally to add a feature or functionality through Javascript. That way my ID name can be a bit more descriptive to the functionality it provides, while my CSS classes are more descriptive to the styles or structure they provide.

IDs to carry more CSS "points", so they can be used to override CSS classes if you're running into problems there. This is a dangerous game though when you start getting into that specific of a selector that you need ID to override a class.

Michael Harry
Michael Harry
1,490 Points
Michael Harry
Michael Harry
1,490 Points

Jacob,

Remember that Id selectors are specific to the page. I believe you should use Id selectors based on what you desire to achieve.

For instance, if you want to assign specific styles to part of your webpage specially and you need no other element share those styles, you should assign an 'Id selector'.

They are also helpful as Fragment Identifiers on your webpage.