NOTE: This is a collection of information and links collected over the years that might provide useful information. A Safer Company LLC does not guarantee, endorse or approve any of these links or their scripts. Use these links to other websites at your own risk.
!important
Cascading Style Sheets (CSS) styles are applied in order as they are read by the browser.
For example:
p { color: red; } p { color: black; } /*This style overrides the previous style*/
The !important property will always be applied no matter where that rule appears in the CSS document. Only use !important for the most crucial styles and if the style is not working using the regular hierarchy of CSS.
For example:
p { color: #ff0000 !important; } /*This style overrides the second style*/ p { color: #000000; }
User Style Sheets
The !important rule is also used to help users cope with style sheets that make pages difficult to read. Usually a user defined style sheet will be over-ruled by the Web page author's style sheet unless the user marks a style as !important even if the author marks their rule as !important.
Example
This example uses the following css. Because of the !important the css overrides the second css.
#example_important { font-size: 2em !important; background-color: green !important; /*!important overrides any background-color*/ } #example_important { font-size: 1em; background-color:pink; /*gives the #container #example a background-color*/ }
This is in the container. The following CSS sets the size and the background-color of the division container example_important to pink.
this is the example_important within the container
Notice that it is green because it has the !important rule.
This is back in the container
Page last updated: June 07, 2012 13:11 PM
Content and Navigation...