开发者

How to define specific CSS rules for IE9 alone? [duplicate]

This question开发者_高级运维 already has answers here: Detecting IE version using CSS Capability/Feature Detection (18 answers) Closed 6 months ago.

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜