When serving Microsoft Internet Explorer 5.5 for Windows a CSS stylesheet placing a comment before the value causes that browser to ignore the declaration. For example given:

div
{
	padding: 1em;
	color: /**/red;
	background: /* IE5.5/Win doesn't see this declaration */yellow;
	font-family: verdana, sans-serif;
}

IE5.5/Win will pick up neither color: red; nor background: yellow since both of these declarations have their values immediately preceded by a comment (whether the comment is empty or not). Other browsers, however, recognize the comment for what it is and ignore just the comment, not the entire line. Incidentally, placing a comment before a value is perfectly valid.

IE6/Win also has this bug on some but not all properties if there is one or more blank spaces between the comment and the value. This is the reason why in the rule above the values are flushed against the comment. IE5.0/Win does not have this bug. This browser along with IE5.1/mac do, however, have the commented property bug, i.e., when a comment immediately follows a CSS property the declaration is ignored by IE5.

Quirks

On certain properties such as color or background-color placing a comment before its value does not allow us to redefine the property again in the same rule. IE5.5/Win will not recognize the property at all in that rule. For example, given:

div
{
	color: red;
	color: /**/blue;
}

IE5.5/Win will apply neither blue nor red. Rather div will just inherit the color of its containing block (its parent). Breaking the rule into two is the only way to make IE5.5 recognize the property and value we want to serve it. Therefore, given the example above if we want the text to have a color of red in IE5.5/Win and blue in other browsers we have to create two rules, one for IE5.5/Win and another for other browsers which would override the former. The rule for other browsers must be written after the rule for IE5.5/Win, unless we give it a higher specificity selector. Thus, we have:

div
{
	color: red;
}

div
{
	color: /**/blue;
}

This problem does not occur with other properties such as width. Therefore, we can write two width declarations in the same rule, one uncommented and the second one with a commented value. IE5.5/Win will read and apply the uncommented value, while other browsers will be able to read both values but apply the second value because it overrides the first (as per CSS cascade rules).

Some Examples

div id="normal"

On CSS-aware browsers including IE5.x/Win this block should render as gray text on a light gray background with the same font size as the main text on this page.

div id="testIE"

On CSS-aware browsers this block should render as gray italicized text on a light gray background with a font size much larger than the main text on this page. But IE5.5/Win does not recognize a declaration when its value is preceded by a CSS comment and so will render this as gray non italicized text of the same size as the main text, just like the preceding block.

CSS rules for the two blocks are as follows:

div#normal
{
	margin: 1em;
	padding: 1em;
	background: #eee;
}

div#testIE
{
	margin: 1em;
	padding: 1em;
	background: #eee;
	font-size: /**/1.5em;
	font-style: /**/italic;
}