What is an asterisk for on class definitions?

speedway

Well-known member
As I make my way around various CSS files I keep seeing asterisks preceding some class names, for example *float: none.

What does this actually mean and do?

Trying to learn as I go along :)

Cheers
 
The asterisk makes the CSS declaration invalid, so it will not be applied.
However due to a bug, some older IE versions (<= IE7) ignore the asterisk, so it's basically a way to easily apply styles to old IE versions.
So for example using *color:red; would make everything red in IE7 and below only.

Similarily, underscore prefixes apply to IE 6 and below, since IE7 fixed the underscore but not the asterisk.

Code:
*color:red; /* IE7 and below */
_color:blue; /* IE6 and below */

It's not really considered to be valid CSS, though.
 
Those are commonly called browser hacks.

Generally you only use these when there is no other way around it and pretty soon they won't be needed at all as some of the more...er...aged browsers finally stop being used.

Here are some other ones that also help you specify an attribute for a specific browser, I only listed the IE stuff but these exist for almost every browser.

IE6
_color: red

IE6, IE7
*color: red;

Everything but IE6
color/**/: red

IE6, IE7, IE8
color: red\9;

IE7, IE8
color/*\**/: red\9;

!important for IE6, IE7
color: red !anything; }

You can go here if you want to see more of them to better understand them. http://browserhacks.com/
 
Back
Top Bottom