To bring more weight to a CSS property, it is suggested to use '!important'.

In CSS, the !important means that “this is important”. In normal use, a rule defined in an external style sheet is overruled by a style defined in the head of the document, this is overruled by an inline style within the element itself.



For example, let's take the following styles were contained in a style sheet. The paragraph text would be rendered in blue, even though the first style of property applied is red. This is because the “blue” value is listed second. Since CSS is read top-to-bottom, the last style is “blue” and it gets applied to the paragraph. 

p { color: red; }

p { color: blue; }


To make the paragraph force to text always red, change the style as follows:

p { color: red !important; }

p { color: blue; }


Defining a rule with the !important attribute that discards by overriding the normal style.

Other examples:

color: lightgreen !important; 

size: 12ex !important; 

text-align:justify !important; 

background-color: darkgreen !important; 


Applicable Versions


Article Information

Last Updated:2019-08-02 20:45:40