Although I always strive to use BEM to keep specificity simple, I'm curious about the limits of CSS specificity and I can't find an answer anywhere. It is often explained in terms of "points", i.e. 1 point for element, 10 for class, 100 for id, 1000 for inline, 10000 for important, etc. and whatever is highest wins. Is there any limit to stacking/adding these points?
Asked
Active
Viewed 32 times
0
-
See https://css-tricks.com/specifics-on-css-specificity/ – Curtis Feb 10 '17 at 16:27
-
There are implementation limits, and these limits differ between implementations. There is no theoretical limit imposed by the spec, except selectors-4 says that if you reach the limit, for example by having a complex selector consisting of exactly 256 class selectors in an impl that only allows 255, the specificity is 0-255-0, *not* 1-255-0. In other words, the class specificity should not overflow into id specificity - [which actually happens in some browsers](http://stackoverflow.com/a/12003060) but is now considered a spec violation. – BoltClock Feb 10 '17 at 16:27
-
The points system that most sources use is flawed, and not at all how specificity is *actually* calculated both according to the spec, and by implementations. – BoltClock Feb 10 '17 at 16:28
-
I expect you can hit a limit (though it will vary per browser/system) but I doubt it's possible without intentionally generating ridiculous selectors. – DBS Feb 10 '17 at 16:28