There are basically two uses of !important css property First use is when you want a particular style to be always applied if its also exist at some other place in the Cascading Style Sheets. As the name suggests “Cascading Style Sheets” this means that the styles will cascade and the browser will render the styles which are applied at the last. i.e if we have a <a> element in our markup and we define CSS like this:-
1: a
2: {
3: font-size:20px;
4: }
5:
and than again at another position below than this if we define
1: a
2: {
3: font-size:40px;
4: }
5:
So it will take font-size of <a> element as 40px not as 20px so if you want that for some elements the style should not change than you should give the a an !important attribute.
1: a
2: {
3: font-size:20px !important;
4: }
5:
Another use of this came into existance with the CSS2.0 whenever a user gives his stylesheets properties a value containing this !important keyword than user’s stylesheet properties override the author’s style sheet properties.