Css:browser Css Hacks For Ie6,ie7,ie8,ie9

CSS:Browser CSS hacks for IE6,IE7,IE8,IE9
by Janeth Kent Date: 11-04-2013


Did you know that there are specific CSS hacks for IE that allow you to target IE8, IE7 and IE6?

We, web developers, are constantly faced with deficiencies of Internet Explorer, and CSS hacks allow to overcome them in most cases.

In this post I would like to group the CSS hacks for each of the popular versions of IE. Most likely you already know the CSS hacks for IE6 and IE7, but for IE8 and IE9 probably not. You would really love them because they are useful & help you get your design closer to pixel perfect.

CSS hack for Internet Explorer 6

~ Called as Star HTML Hack
.class {
  _height:300px;
  _width:300px;  
}

OR

*html #div {
  height:300px;
  width:300px;  
}

CSS hack for Internet Explorer 7

.class {
  !height:300px;
  !width:300px;  
}  

OR

*+html #div {
  height:300px;
  width:300px;  
}  

CSS hack for Internet Explorer 8

.class {
  height/*\**/: 300px\9;
  width: /*\**/: 300px\9;  
}  

OR

@media \0screen {
   .class {
     Padding-top: 10px;
		}  
}  

CSS hack for Internet Explorer 9

:root .class {
        Padding-top: 10px;  
}  

With these ! Or _ declarations, you can change the height, width, padding, margin etc any Css for IE6, IE7, IE8 & it won’t affect firefox & most other browsers.

CSS hack for FireFox

@ -moz-document url-prefix() {
  .class {
     Padding-top: 10px;
  }  
}
 
by Janeth Kent Date: 11-04-2013 hits : 5503  
 
Janeth Kent

Janeth Kent

Licenciada en Bellas Artes y programadora por pasión. Cuando tengo un rato retoco fotos, edito vídeos y diseño cosas. El resto del tiempo escribo en MA-NO WEB DESIGN END DEVELOPMENT.

 
 
 

We use our own and third-party cookies to improve our services, compile statistical information and analyze your browsing habits. This allows us to personalize the content we offer and to show you advertisements related to your preferences. By clicking "Accept all" you agree to the storage of cookies on your device to improve website navigation, analyse traffic and assist our marketing activities. You can also select "System Cookies Only" to accept only the cookies required for the website to function, or you can select the cookies you wish to activate by clicking on "settings".

Accept All Only sistem cookies Configuration