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 trialKirk Rohani
Full Stack JavaScript Techdegree Student 2,312 PointsWhat if we use both ID selector and Class selector, which takes precedence?
If an HTML tag has both selectors and the CSS file defines let's say background-color (pick any property) for both selectors, which takes precedent, the id or class?
2 Answers
andren
28,558 PointsThe ID selector takes precedence, due to a concept in CSS called Specificity. Specificity is a bit complicated but essentially all CSS rules has a score calculated based on what (and how many) selectors are present in them. The selector with the highest score wins out. ID selectors are prioritized over class selectors, and class selectors are prioritized over element selectors.
A useful resource for understanding Specificity is this Specificity calculator, it allows you to put in two or more CSS rules and shows you in a pretty visual way which gets the higher score and why.
Kirk Rohani
Full Stack JavaScript Techdegree Student 2,312 PointsThanks Andren! So like 2 minutes later in the CSS Basics video Guil ends up answering my question.
I gotta learn to be more patient!