Kathirvel K

CSS hacks

Posted on: February 25, 2009

IE 6 and below

* html {}

IE 7 and below
*:first-child+html {} * html {}

IE 7 only
*:first-child+html {}

IE 7 and modern browsers only
html>body {}

Modern browsers only (not IE 7)
html>/**/body {}

Recent Opera versions 9 and below
html:first-child {}


Simple Example

<style type="text/css" >
.style1{ background:green; } /* FF, Chrome */
.style1{ background/*\**/: blue\9 }
 *+html  .style1{ background:red; }  /* or *:first-child+html for IE 7 */

*html .style1{ background: yellow; } /* IE 6 */</style>
<div class="style1"><h3> Green in FF, Chrome </h3><br />
<h3> Blue in IE8 </h3><br />
<h3> Red in IE7 </h3><br />
<h3> Yellow in IE6 </h3><br /></div>

Conditional comments:

<!--[if condition]> HTML <![endif]-->
<!--[if !condition]><![IGNORE[--><![IGNORE[]]> HTML <!--<![endif]-->

condition is one of the following:

Any version of IE
lt IE version
Versions less than version
lte IE version
Versions less than or equal to version
IE version
Only version version
gte IE version
Versions greater than or equal to version
gt IE version
Versions greater than version

version is the version of Internet Explorer, typically 55.56, or 7



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: