Using !important in CSS

Don't.

You are still here, so I guess you were expecting a more detailed explanation... here it goes:

The use of !important is considered an anti-pattern and bad practice. !important overrides all other declarations and makes the CSS code more difficult to maintain and debug. The only thing that can override an !important is another !important, and once you go down that road, it never stops.

From a Web Accessibility perspective, the use of !important is negative because it would override the end-user defined styling. And there are multiple cases in which users and especially users with disabilities may want to override some of the CSS properties (e.g. to enlarge the font size, or change the font-family, or even change the distribution and position of elements in a page.)

What can developers do instead of using !important?

• Use more specific selectors: add the element tag before the class/id name, or a new class name... anything that increases the specificity of the selector.
• Take advantage of the CSS cascade: if needed, restructure the CSS and move the CSS rules, as if two rules have the same specificity, the one that appears later "wins."

Avoid using !important in CSS.