Saturday, May 11, 2013

IE8 CSS Hack

Using IE8 CSS Hack


You can use the ie8 css hack to force internet explorer to accept your @media queries. The ie8 css hack circumvents the inherent blockage/neglect by internet explorer. After finding the great solution to browser responsive CSS with @media queries you probably cried when finding out they don't work in IE9 and earlier.


This is normal use of: @media 
IE8 CSS Hack
IE8 CSS Hack
The above is discarded by IE9 and earlier. A way around this problem is by using the ie8 only css hack. 

To target IE 6 and 7

@media screen\9 {
    body { background: red; }
} 


To target IE 6, 7 and 8

@media \0screen\,screen\9 {
    body { background: green; }
} 

To target IE 8

@media \0screen {
    body { background: blue; }
} 

To target IE 8, 9 and 10

@media screen\0 {
    body { background: orange; }
} 

To target IE 9 and 10

@media screen and (min-width:0\0) {
    body { background: yellow; }
} 

Big thanks to Keith Clark for finding this ie8 css hack for @media queries.
It does not solve everybody's problem depending on your exact coding but using this css ie8 hack can help in some instances.

No comments:

Post a Comment