i wonder if you know a way to able or disable a css rule when client has ie.
I've this style
#number_one{
background-image: url("../img/pins/1.png");
top: 250px;
left: 115px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/pins/1.png',sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/pins/1.png',sizingMethod='scale')";
}
I want background-image to work on all browser except IE, becuase Filters will do the background-image job.
Anyone know how to solve this? Thanks a lot.
An easy way (without the need for multiple separate stylesheets [which works too, by the way]) is to replace your <html> tag with this:
<!--[if IE]>
<html class="ie">
<![endif]-->
<!--[if !IE]>
<html class="normal">
<![endif]-->
And in your CSS, use this to target only IE:
html.ie #number_one{
background-image:none;
}
Or use this to target all browsers except IE:
html.normal #number_one{
background-image: url("../img/pins/1.png");
top: 250px;
left: 115px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/pins/1.png',sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/pins/1.png',sizingMethod='scale')";
}
Include this in head for IE specific styles and overwrite CSS here:
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->
It is also feasible to target each version of IE separately:
<!--[if IE 6]>
<link rel="stylesheet" href="http://mysite.com/path/to/ie6-only.css" type="text/css" media="screen, projection">
<![endif]-->
You should be able to create an IE-only stylesheet, and change the class accordingly using this method I found:
To target IE using conditional comments, just add this line to the >head< tags of your HTML file:
1 <!--[if IE 6]><link rel="stylesheet" href="http://mysite.com/path/to/ie6.css" type="text/css" media="screen, projection"><![endif]-->
2
3 <!--[if IE 7]><link rel="stylesheet" href="http://mysite.com/path/to/ie7.css" type="text/css" media="screen, projection"><![endif]-->
These conditional comments will be ignored by every other browser so only IE 6 and IE 7 respectively will load these stylesheets. Now all you need to do is create the files on your server and override whatever CSS rules are messing with IE’s headers.
