Apologies for the vague title, but I wasn't sure how else to phrase this question.
I'm following the MDN CSS Guide, and the Specificity section reads
The amount of specificity a selector has is measured using three different values (or components), which can be thought of as ID, CLASS, and ELEMENT columns in the hundreds, tens, and ones place:
They then go on to show examples of specificity values for various selectors
My question is - is this system a genuine base-ten arithmetic system, or it simply a ranked priority system?. In other words, if selector A has 0 identifiers, 0 classes, and 11 elements and selector B has 0 identifiers, 1 class, and 0 elements, does selector A or B have greater specificity?
In a base ten system, selector A would have greater specificity because its value would be 100*0 + 10*0 + 11*1 = 11, whereas selector B would have specificity 100*0 + 10*1 + 1*0 = 10.
On the other hand, in a ranked priority system, selector B would have more specificity because it has a greater number of classes, allowing you to short-circuit the rest of the specificity calculation so that elements are not even examined.
My hunch says that it is the ranked priority system, but the quote above makes it sound like a base ten system which I don't really see the value in. I'll be glad to hear why it is used if it is indeed the system CSS implements.
