Mastering CSS

Should we use classes or IDs?

Now, you're probably thinking, what's the difference between a class and an ID? Well, the first point to make is an ID has more weight than a class, literally 10 times more weight. Keeping your selectors lightweight is one of the keys to scalable, reusable CSS. What does having more weight really mean? It means it's more specific and an ID will overrule any class. We'll deep dive into specificity rules and weights in Chapter 4, Creating Buttons with Modular, Reusable CSS Classes, and CSS3. For now, just know that IDs will overrule classes when targeting the same element. The second point to make is that an ID is unique, and therefore, it can only be used once per page. Given these two points, primarily the first ...