What are the reasons to use the id attribute for CSS purposes? [closed]

Question

I've always used the class attribute, never id for the purpose of CSS selecting and styling. I know that the id must be unique, but that doesn't seem to be a reason to use it for CSS.

The only reason I have used the id attribute is for JavaScript and form labelling.

I find mixing id and class for the purpose of CSS can cause confusion, and for me it's a good way to force separation of style and behaviour.

Is there a good reason to use id for CSS purposes? Is there anything that can be achieved with id that can't be done with class?

Comments I found useful/interesting

• You could say the same thing about classes. There's lots of JavaScript out there that does (and must) target elements of a specific class. Changing the class in those instances is just as problematic from a behavior standpoint. - AaronSieb
• IDs have different specificity in the cascade than classes. - Killroy
• Using ID for styling makes sense if it's an element that doesn't have duplicate, especially if it's something that shows up in all/most pages - RichN

Answer 1

Using ID for styling makes sense if it's an element that doesn't have duplicate, especially if it's something that shows up in all/most pages.

E.g.:

• Page header & footer
• Search box (the thing you can see up there)
• Navigation list (something like the thing on the right)