IE8 css selector

Question

To target elements only in IE browsers i\'ll use

IE6:

* html #nav li ul {
    left: -39px !important;
    border: 1px solid red;
}

Answer 1

Building upon image72's excellent answer, you could actually have advanced CSS selectors like this:

so that in your css you can do this:

.notIE   .foo { color: blue;   } /* Target all browsers except IE */
.IE9up   .foo { color: green;  } /* Taget IE equal or greater than 9 */
.IE8     .foo { color: orange; } /* Taget IE 8 only */
.IE7down .foo { color: red;    } /* Target IE equal or less than 7 */

.IE8 .foo, .IE9 .foo {
    font-size: 1.2em;            /* Target IE8 & IE9 only */
}

.bar { background-color: gray; } /* Applies to all browsers, as usual */

/* Maybe show a message only to IE users? */
.notIE #betterBrowser { display: none;  } /* Any browser except IE */
.IE    #betterBrowser { display: block; } /* All versions of IE */

This is great because:

• It's perfectly standards compliant (no ugly/dangerous css hacks)
• No need to have separate stylesheets
• You can easily target any version of IE as well as complex combinations