CSS processing order

Question

I'm at odds with my boss over CSS processing order.

Boss insists that order of selectors in CSS file should match the order in which those selectors are used in calling web pages. He claims that such structuring is forced by browsers which read CSS file content sequentially and apply the rules in that sequence.

I think this is wrong.

If my programming experience has any relevance to CSS application, and I am .NET programmer, browsers read CSS files first and for each selector a memory reference (pointer akin method memory reference) is created and then, as the browser reads html file and renders a page, each time a selector is used, browser references appropriate memory address with style rule and applies changes while final result is being rendered in DOM. The sequence in CSS file is irrelevant.

I can't support my claim with any documentation. Does anyone know where I could find technical documentation regarding this and prove me right or wrong? Is there a rule to how to organize CSS file?

Answer 1

The order matters, but only when the specificity is equal.

e.g.

.one { color: black; }
.two { color: red; }

with

<div class="one two">...</div>

… will be different depending on which order the CSS rulesets appear in.

See the cascade for more detail.