The text above was taken from http://css-discuss.incutio.com
Please read the red text below at least 10 times… 🙂
“What’s the expected behavior when an element has multiple classes which redefine properties? Here’s an example:
<style type="text/css"> .headline { border: 3px solid red } .newsitem { border: 2px solid red } .blurb { border: 1px solid red } </style> ... <h1 class="headline newsitem blurb">French Noblewoman Advocates Increased Cake Consumption Among Peasants</h1>
Will the border of the H1 element be 3, 2, or 1 pixel wide?
To answer this question you need to understand how Selector Specificity works in CSS. In this case the (rough) answer is the “last highest-weighted rule wins”, so the border will be 1px. Note that it’s the order of the rules in the stylesheet that controls which takes precedence; the order of the class names in the class attribute is irrelevant.”