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

Java Build a JavaFX Application Design a Better App Resources

Paramvir Singh
Paramvir Singh
1,517 Points

Styling by Class vs Id

In this video, it was said that styling by Id is more powerful than Styling by Class but what will it make a difference if I style a text by Id then in the next line I style the text using class? Something just like this,

myText {

/code for changing the font color to red/ }

.text { /code for changing the font color to blue/ }

So, what will be my font color, red or blue?

1 Answer

andren
andren
28,558 Points

It will be red. In CSS there is a concept called Specificity which is one of the main things used to determine what rule takes priority when you have conflicting rules. Id selectors have a higher specificity than class selectors. To be specific Id selectors have a specificity of 100, while class selectors have a specificity of 10.

If you have multiple rules with the exact same specificity then the order of the rules matter (the last defined rule will win out) but if there is a difference in specificity then the rule with the highest specificity will always win. This specificity calculator offers a pretty visual way of showing off how different selectors affect the specificity of a rule.