CODEWITHSUNDEEP
htmlcss
niko
niko

Reputation: 9393

what is the reason to use ! important in the below stylings

http://csscreator.com/node/29717 I have found these page on google ,to disable vertical or horizontal scroll bar.

 user used overflow-y: scroll ! important; overflow-x: hidden ! important;

It even worked these way 

overflow-y:scroll; overflow-x:hidden;

I was wondering why did he go for these ('! important') after the scroll or hidden values.Is there any harm if i dont use ('! important') ? or is it fine ? Could you tell me why did he use ! important after the scroll or hidden.

Upvotes: 2

Views: 5091

Answers (5)

Salvatore Previti
Salvatore Previti

Reputation: 9050

!important is a keyword. It is often used to use "browsers quirks" to make the same html page compatible with the most important browsers, to circumvent bugs (most notably, with internet explorer).

http://en.wikipedia.org/wiki/CSS_filter#.21important_quirks

http://webdesign.about.com/od/css/f/blcssfaqimportn.htm

http://www.electrictoolbox.com/using-important-css/

Upvotes: 1

Aniket
Aniket

Reputation: 9758

Well, he might have just used !important just like that.

The use of !important can be explained in this way.

Let's suppose that you have 2 stylesheets in your HTML file.

  1. base.css
  2. style.css

One of them is a base stylesheet and the other is the one with which you are trying to make the changes. To override any of the already defined properties in base.css, you need to write the selectors and classes in exactly the same way.

To get away with all the trouble, you might go and override those properties using !important

I hope this solves your query.

Upvotes: 0

Lapple
Lapple

Reputation: 3373

The !important flag, in this case, will override the browser's default behaviour.

It is considered to be a good trick to set overflow-y: scroll !important; to automatically display the disabled vertical scroll bar even when the page is not vertically very long (e.g. 404 page or a FAQ page with collapsed panels).

overflow-y: scroll !important; prevents your pages from shifting left or right when user either goes from a shorter page to a longer one or expands/collapses a tab or section.

However, I feel that overflow-x: hidden !important; is a bad practice, since it prevents the horizontally long content (which does not fit the browser's viewport) from being displayed at all.

Upvotes: 0

Ya Zhuang
Ya Zhuang

Reputation: 4660

!important makes the rule own the highest priority, so that it can not be override by some other rules

Upvotes: 0

Fischermaen
Fischermaen

Reputation: 12458

!important overrules any inherit value, so it is important.

Upvotes: 0

Related Questions