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

HTML

Class vs ID

Whats the difference between these two? Does it greatly affect CSS when you use them incorrectly? or maybe I haven't fully grasped what they do yet. Thank you.

3 Answers

Hi Munoz,

ids and classes are very different and yes it is important to understand the difference. ;-) But you will...

Classes you can assign to multiple elements. So you can use one class for let's say headings and then reuse them again and again for all headings on your page. Or for paragraphs or for divs.

IDs however can be only used once and they have the highest priority in styling. You can use them when you want to specify css for one particular element and one id can only be used once. That's also because you can use ids as points in your webpage that you want to link to from somewhere else.

Let's say you have a part on your webpage about yourself ("About Me") and it is at the bottom of your page. If you want to link to this part from the top of your page you can do that the following way:

  1. First you give the part about yourself an id. Let's say it starts with a heading:
<h1 id="about-me">About Me</h1>

Then you can link to this like this:

<p>You find more about me <a href="#about-me">HERE</a></p>

You could not do that with a class.

So generally you first want to use classes for styling and only if you want to be very specific or want to link to a certain part of your page you use an ID.

Makes sense?

Happy coding!

Nils

PS: You can upvote my post and/or mark as "best answer" (at the bottom of my post) if it helped you. :-)

BERYL YOUNG
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
BERYL YOUNG
UX Design Techdegree Graduate 39,697 Points

You would use class when you want to target many elements and id when you want to target one specific thing. As to does it make a difference in css? That would depend on the context. If you are thinking in terms of say an application run in a business then considerations of how this code could be maintained comes into play. How easy would it be to change several tags, each with it's own id as opposed to changing a class that is given to several tags? Planning is king as they say. :)

This has been a huge help!! I'm rather timid when it comes to asking questions, but it seems that if I clearly don't get something asking the Treehouse community is a big help. Thank you so much both of you and Nils with an amazing explanation as to what the difference is.

Great! Very happy to help...

And yes, you usually always get help here if you kindly and specifically ask for it.