I have a CSS/jQuery Checkbox style script: http://jsfiddle.net/BwaCD/
The problem is, in current browsers in order for the span to float over the input, the input's position must be absolute. But in IE8 & below, the script will not work and therefore I'm left with and absolutely positioned input that is just floating over other elements. I am not asking for the script to work in IE8 & below.
I want to know how I can use CSS to set a specific style if it is IE8 and below. I guess jQuery would be acceptable if it's necessary, but I don't think it is. I know this can be done with just CSS & HTML I just don't know how.
Conditional comments would work (<!--[if lte IE 8]><stylesheet><![endif]-->
), but if you want to do it all in the stylesheet, there is a way:
body {
color: red; /* all browsers, of course */
color: green\9; /* IE only */
}
The important thing here is the "\9", which has to be exactly "\9". I'm not clear on exactly why this is.
EDIT: The \9 hack isn't enough by itself. To exclude IE9, you also need the :root
hack:
:root body {
color: red\9; /* IE9 only */
}
Other browsers besides IE might support :root
, so combine it with the \9 hack if you're using it to target IE9.