When Using !important is right option. As there are lots of cons & disadvantages of using it. I have created a presentation containing all advantages and disadvantages of using CSS !important.

1. When CSS !important
BY: AAMIR SHAHZAD
FRONT END DEVELOPER
HTTP://AAMIRSHAHZAD.NET
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

2. Contents
 History
 Syntax
 What CSS !important does?
 When to use !important
 Cons of !important
 Fun facts about !important
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

3. History
CSS !important was added in CSS 2.1 (no changes to it in CSS3)
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

4. Syntax
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

5. What CSS !important does?
An !important declaration provides a way for a web designer or developer to give a CSS value
more weight than it naturally has.
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

6. Sometimes…
WHY CSS NOT WORKING?
Use !important rule (whisper)
OK, now it's working
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

7. When to use !important…
Never!!!
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

8. However…
When using external CSS from CDN you can’t change
When using a plugin having CSS you can’t change; like bootstrap CSS
When requirement is a property not to over-ride even by JavaScript
When too much effort is required if you want to avoid it and adding it doesn’t effect much
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

9. Still these can be solved!
When using external CSS from CDN you can’t change
When using a plugin having CSS you can’t change; like bootstrap CSS
Adding CSS from CDN or plugin before your normal CSS file, will allow you to not use !important
except any property having !important in that CSS.
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

10. Cons
Code will not be maintainable
If you have added !important with some generic CSS properties you have to override each time
if you want something different + this class. So never use !important with generic class.
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

11. Cons
!important disrupts the natural flow
Naturally style of second class should apply. But as first class using !important therefore, this will
be overridden by first class. Use different classes to avoid this problem.
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

12. Cons
He/she has to debug and find why his/her applied style is not applying. They have run through
code where and why !important is used. To apply their style every time they have to use
!important with CSS property value otherwise style will not apply.
Painful for other developers
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

13. Cons
One !important means there will be others
Yes this very right once you have started using !important specially with some generic class or
element each time in order to apply new style on an element you have to add !important. Which
a bad practice.
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

14. Fun facts
In IE6 and IE7, if you use a different word in place of !important (like !somedog), the CSS rule will
still be given extra weight, while other browsers will ignore it
If for some particular reason you have to write the same property twice in the same declaration
block, then add !important to the end of the first one, the first one will have more weight in
every browser except IE6 (this works as an IE6-only hack, but doesn’t invalidate your CSS)
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

15. Common symptoms
1. Fatigue
2. Tension
3. Revenge
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET

16. Any Questions or Suggestions ???
7/26/2015 AAMIR SHAHZAD - HTTP://AAMIRSHAHZAD.NET