Is it really that !important?

Earlier I took a look at the cascade in CSS (Cascading Style Sheets). There was mention of the !important setting in style sheets, but let’s take a closer look it what it does.

Using !important basically tells the user agent to use this rule, no matter what. If there’s a different definition of this specific rule later in the same style sheet, or one with a with more weight, ignore those, and use this one.

You as a visitor to my page, may have your own way you want to view pages you browse. Let’s say you want pages always to have padding of 20px and you create a style sheet. Your definition may look like this
body { color: #000000 !important; padding: 20px !important; }
After applying the default style and your style, the rule would be
body { color: #000000 !important; padding: 20px !important; line-height: 1.33 }
Even though my style,
body { color: #FFCC00; padding: 0; margin: 0; }
is applied after your style, the rules with the !important setting will still be used, overruling my definition, resulting in the next definition as final rule:
body { color: #000000; padding: 20px; margin: 0; line-height: 1.33 }

Another very good use of the !important setting is when you want to make sure that, in case of importing several style sheets, the specific rule is not overwritten by similar rule.

If the !important setting is used on the same selector more than once, the last definition will overrule the earlier. However, if the same selector is set as !important in the style sheets of both the author (me) and the user (you), CSS2 specifies that the user’s definition (yours) will take precedence.