Purpose of asterisk before a CSS property

Css

Css Problem Overview


The following is taken from the Yahoo CSS reset. Can someone please explain the purpose of the asterisks?

body {
  font:13px/1.231 arial,helvetica,clean,sans-serif;
  *font-size:small;
  *font:x-small;
}

Css Solutions


Solution 1 - Css

It is a browser specific CSS hack for versions 7 or below of Internet Explorer.

> property: value > > Although Internet Explorer 7 corrected > its behavior when a property name is > prefixed with an underscore or a > hyphen, other non-alphanumeric > character prefixes are treated as they > were in IE6. Therefore, if you add a > non-alphanumeric character such as an > asterisk () immediately before a > property name, the property will be > applied in IE and not in other > browsers. Unlike with the hyphen and > underscore method, the CSS > specification makes no reservations > for the asterisk as a prefix, so use > of this hack could result in > unexpected behavior as the CSS > specifications evolve. > > *property: value applies the property value in IE 7 and below. It may or may > not work in future versions. Warning: > this uses invalid CSS.

From: http://www.javascriptkit.com/dhtmltutors/csshacks3.shtml

Solution 2 - Css

It's an Internet Explorer hack. If you add a non-alphanumeric character such as an asterisk (*) immediately before a property name, the property will be applied in IE7 and below, but not in other browsers.

http://www.javascriptkit.com/dhtmltutors/csshacks3.shtml

Solution 3 - Css

Placing characters like that is a hack/workaround for getting IE 6 to use a style's property, while hiding it from more "sane" browsers.

From here:

> To cut a long story short, the Internet Explorer CSS parser is overly > aggressive at trying to discover the names of properties and will in > fact ignore leading non-alphanumeric characters. From my testing this > appears to be the case from at least IE5 onwards.

Solution 4 - Css

All browsers but IE ignore the rules. It's known as the star hack. I think IE7 will ignore the rules in standards mode.

In this case, the font rule is set and then overridden for IE 6 and sometimes 7.

Solution 5 - Css

As far as I know, asterisk prevents Firefox to read the attribute, but is valid in IE.

Solution 6 - Css

It's a CSS hack, that rule will only be applied to IE7 and below.

I wouldn't recommended using it though, there's better ways to fix IE incompatibilities.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJeremyView Question on Stackoverflow
Solution 1 - CssWaleed AmjadView Answer on Stackoverflow
Solution 2 - CssRobert HarveyView Answer on Stackoverflow
Solution 3 - CssJasonWyattView Answer on Stackoverflow
Solution 4 - CssFrank DeRosaView Answer on Stackoverflow
Solution 5 - CssVladimir KocjancicView Answer on Stackoverflow
Solution 6 - CssPsilokanView Answer on Stackoverflow