What is

!important

used for and when should I use it?

 

Thanks.

What is

!important

used for and when should I use it?

 

Thanks.

hello

 

try this link

 

http://www.w3.org/TR/CSS2/cascade.html

 

article 6.2.1 i think

Hi Meschach,

 

Coincidentally, the site that you've been helping me uses the "! important" rule. I used it to make the highlight the current page in the navigation menu. Here I've used the same style as for the hover state, but browsers refused to implement it until I added ! important because I'd already declared a style for the static links. In other words, ! important overrides existing style rules, something like this:

 

		 #nav li a:link, #nav li a:visited {
	  color: red;
	  }

	  #nav li a:hover {
	  color: blue;
	  }

	  .current {
	  color: blue ! important;
	  }

 

I then assigned the .current class to the "current" anchor:

<li><a href="directions.html" class="current">Google Map</a></li>

 

The ! important rule is also invaluable for print style sheets to override the 'screen' styles:

 

	 #nav, #header, #footer {
			  display: none;
			  }

	#container, #content, #rightcol {
			  width: 100% ! important;
			  margin: 0 !important;
			  }

 

 

Note that there should be a space between the exclamation mark and 'important'.

I hope this helps.

 

Marie

Hmm... Why would you want to override existing ones rather than just making a new class?

 

Just curious..

Hmm... Why would you want to override existing ones rather than just making a new class?

 

Just curious..

 

I'd recommend not using it if it all possible! The only time (off the top of my head) I see a valid use of it is when you need to have a cross browser minimum height set for an element:

 

e.g, min-height: 100px; height: auto !important; height: 100px;

 

The more you start adding hacks like !important into your styles the less control you end up having over whats going on which invariably leads to more and more hacks needed to keep sites working across browsers. The extra time spent in working out exactly why things display differently in two different browsers (e.g FF and IE ) will save you loads of time wasted from the headaches of hacks!

I'd recommend not using it if it all possible! The only time (off the top of my head) I see a valid use of it is when you need to have a cross browser minimum height set for an element:

 

e.g, min-height: 100px; height: auto !important; height: 100px;

 

The more you start adding hacks like !important into your styles the less control you end up having over whats going on which invariably leads to more and more hacks needed to keep sites working across browsers. The extra time spent in working out exactly why things display differently in two different browsers (e.g FF and IE ) will save you loads of time wasted from the headaches of hacks!

 

Thanks for the info.