What are the priorities among CSS selectors
css, css-selectors, html
Solution
The gory details in the spec are actually reasonably readable. In summary:
`!important` rules and inline `style` rules win most.
Otherwise, normally the more specific wins. `#id` is a more specific selector than `.classname` is a more specific selector than `tagname`.
Where rules are equally specific, the one declared last wins.
There is no particular reason why this ‘shouldn't happen’. It's normal to specify a broad-brush rule and then add a more specific rule to target one case; multiple same-property rules on a single element are not unusual or undesirable.
Problem
CSS Question: If two different selectors apply to an element, who wins? I know this shouldn't happen, but I want to tweak a legacy application, and the CSS is getting in the middle.