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

Posted by Johannes Christian van Zyl
Johannes Christian van Zyl
1,154 Points

id vs class selectors

Hi there!

I have come across different examples of html and css where div containers such as the nav and body are allocated id selectors and elsewhere allocated as class selectors. For instance, in one example the div container is a div class="container"and in a different example its div id="container". Same goes for the "nav" section in both examples. Is it entirely up to you to decide?

I know that the same id selector can't be used more than once per page as apposed to the class selector. In my example(only one page was used as an example with "make belief" links) the div class="nav" was only used once on that page. Would it have been wrong to use the div id="nav" instead?

Any help would be much appreciated! Thanks!!!

1 Answer

Kevin Korte
Kevin Korte
28,149 Points

You're spot on. You can use class or id, depending on how many times you plan to use it. For something like a container or wrapper I'll use it as a class 100% of the time, because I'll usually have multiple containers or wrappers on a page.

I'd say I use a class over an id about 95% of the time, even when I'm developing a nav bar, which will only be used once per page. For one reason, a class can have more than once class, but an id can only have ONE id.

But ID's do do something cool. You can link to them with an href somewhere else on that page, and when that link is clicked, the browser will jump to that div id on that page.

You can read more here:

http://css-tricks.com/the-difference-between-id-and-class/

To answer your last question, you could have used

<div id="nav">

instead of using it as a class, but it would have served no purpose otherwise.

Johannes Christian van Zyl
Johannes Christian van Zyl
1,154 Points

Thanks Kevin!!!