IE 7 fallback in CSS

Question

I was playing around with this CSS in my IE9 browser:

className{border: red solid 1px; *border: black solid 1px;}

In IE 8,9 the border is shown red. When I turn on IE 7 compatibility mode, I see the black border.

It looks liks the *border syntax is a fallback only for IE.

Does anyone know about this star (*) CSS rule & what does it do? How well does it work for which browsers?

Answer 1

It is incorrect CSS so not parsed in most (good) browsers. Older IE however parses it as valid CSS and applies the rule. Using an underscore works in the same way.

See here for further information, or here

This is different to the use of the asterisk as a universal selector in CSS

Answer 2

*+html SELECTOR {}

targets only IE7 and keeps the CSS valid. This should be prefered.

Answer 3

The only time I ever use the star is for the inline block fix for ie7, the star just allows you to target ie6 (from i remember) as well as ie7. You can also use an exclamation mark to target ie7 if you're feeling lazy (!border:1px solid #000)