Is there a way to call IE conditionals from within CSS? I want to avoid calling a long string of IE css files from my code.
<!--[if IE 7]>
<link href="ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if IE 8]>
<link href="ie8.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if gt IE 8]>
<link href="ie-gt-8.css" rel="stylesheet" type="text/css" />
<![endif]-->
and would like to have one call
<!--[if IE]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
and have the conditionals within the css file. Is that possible or is Paul Irish the way to go?
I tried applying the "advanced rules" suggested in this article
#column_right {
float:left;
width:250px;
margin-left:-250px;
[if IE 6] ie6: 100%;
[if lt IE 6] lt-ie6: 100%;
[if lte IE 6] lte-ie6: 100%;
[if ! lte IE 6] not-lte-ie6: 100%;
}
#footer {
clear: left;
width: 100%;
[if IE 5.0] padding: 10px 0px;
[if IE 5.5] margin-bottom: 40px;
}
[if IE 5] .box {
width: 200px;
padding: 100px;
margin: 100px;
}
but this doesn't work for me. I tried something basic, like
[if IE 7] background-color: red;
[if IE 8] background-color: yellow;
No. That is not possible. But it is possible (sometimes) to code for all IEs and consolidate your code. Conditional comments don't exist in IE, but there are hacks however I would not recommend these, ever!