How to define specific CSS rules for IE9 alone? [duplicate]
Friends, please help me in defining specific css rule for IE9? For example like this
/* IE 6 fix */
* html .twit-post .delete_note a { background-position-y: 2px; }
* html .twit-post .delete_note a:hover { background-position-y: -14px; }
You can prepend the CSS style with
:root
to make it IE9-specific, like this:
:root #element { color:pink \0/IE9; } /* IE9 */
Use IE conditional comments:
<!--[if ie 9]>
your stuff here
<![endif]-->
\9 is a "CSS hack" specific to Internet Explorer.
This simply means that the one specific line of CSS ending with a \9;
In your example, If your CSS looked like this...
html .twit-post .delete_note a
{
background-position-y: 2px\9;
}
html .twit-post .delete_note a:hover
{
background-position-y: -14px\9;
}
The result would be background-position-y: -14px; in IE 9
I think you can do the same as if you want to write specific code for IE6 but say IE9 instead :)
<!--[if IE 9]>
Special instructions for IE 9 here
<![endif]-->
use conditional CSS:
(place the code above the <head>
on your html, and IE9 will read that extra CSS file)
<!--[if (gte IE 9)|!(IE)]><!-->
place the link to the CSS file here
<![endif]-->
This means the approach is with a new CSS file rather than a hack in the classes, this guarantees the CSS are valid.
I found that in some cases using negative values (when using a compiler to compile LESS files) using:
margin-right: -15px\9; /* This fails */
margin-right: ~"-18px\9"; /* This passes */
You shouldn't need to target IE9. It is capable of handling modern css and shouldn't be hacked. This is an outdated method of developing.
精彩评论