1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

What is an asterisk for on class definitions?

Discussion in 'Styling and Customization Questions' started by speedway, May 10, 2013.

  1. speedway

    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 :)

  2. Filetrip

    Filetrip Member

    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.

    *color:red; /* IE7 and below */
    _color:blue; /* IE6 and below */
    It's not really considered to be valid CSS, though.
    speedway likes this.
  3. speedway

    speedway Well-Known Member

    Excellent, thanks for that. Clear alots of things up actually :)
  4. EQnoble

    EQnoble Well-Known Member

    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.

    _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/
    Steve F and speedway like this.

Share This Page