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
Lynn Patricia
7,908 PointsWhen to use class or id
In this exercise, and previous ones, page sections like header, footer, etc. are given semantic classes of "main-header" and "main-footer."
Because a main header and main footer appear only once on the page why not give them ids instead of classes?
2 Answers
Benjamin Larson
34,055 PointsYou could legitimately give such elements an ID (instead of, or in addition to classes).
ID's should be unique to a page, but can (and often should) be reused across multiple pages. HTML5 section elements like header, main or footer can sometimes mitigate the need for repetition of ID's, because they can themselves be "hooked into" as CSS selectors, but one significant distinction between classes and ID's is that an ID can be hyperlinked and classes cannot.
If you've ever seen a URL that looked like this:
http://somewebsite.com/index.html#latest
then you'll notice that it links to the specific part of the page where the contents of that ID (in this case, the #latest ID) will be loaded at the type of the page.
eduardomejia2
Courses Plus Student 22,237 PointsHello Lynn, the main reason to use classes instead of IDs is because you could use it across several pages and you will only write your code once.
Lynn Patricia
7,908 PointsI know an ID can appear only once per page but can you not use the same ID on another page?
eduardomejia2
Courses Plus Student 22,237 PointsYes you can use IDs in several pages, but take into account that when someone else reads your CSS code will be able to find out that those class selectors affects several elements across different pages, otherwise that person will think that your ID selector only affects one element in your whole site.
Lynn Patricia
7,908 PointsAh. So we do it for the humans. :0D
eduardomejia2
Courses Plus Student 22,237 PointsThat is right Lynn!