You’re viewing an archive of outdated material. Visit The Web Standards Project’s updated site to learn about our current mission.

Incorrect Error Handling

The error-handling in IE's CSS parser is in direct violation of the specification. The CSS1 specification explains in detail how things should be handled (i.e., what to ignore), but IE fails to follow important guidelines in this part of the standard.

To demonstrate this graphically, this page has the following stylesheet:

     BODY { background: white none; color: black; }
     @three-dee {
       H1 { color: red; background: white none; }
       P  { color: red; background: white none; }
     }
     A { text-decoration: underline overline line-through diagonal; font: bold highlighted 100% sans-serif; }
     EM, P ! EM, STRONG { font-size: 200%; }

All text on this page should be black on white, there should be no large text except for the headers, and there should be no underline, overline or strike-through text. IE generates a different result.

Example 1

The first rule which we'll focus on is the following:

     @three-dee {
       H1 { color: red; background: white none; }
       P  { color: red; background: white none; }
     }

IE should ignore this completely, since the at-rule "three-dee" does not exist in either CSS1 or CSS2, nor is it a Microsoft extension. This rule should do nothing. While the paragraphs should be displayed in black text, IE displays them in red.

Example 2

The next problem is just as serious. Examine this next rule:

     A { text-decoration: underline overline line-through diagonal; font: bold highlighted 100% sans-serif; }

This should not effect the links and anchors on this page. Since the links are stricken out and in bold, IE is in violation of the spec. This is because the text-decoration property does not take the diagonal keyword, and thus that part of the rule should be ignored. The same thing should happen with the font property, since highlighted is not a valid keyword for fonts either!

Example 3

The last problem is similar:

     EM, P ! EM, STRONG { font-size: 200%; }

This should, once again, have no effect -- the ! symbol means nothing in CSS1 and CSS2 and should be causing the entire rule to be ignored. Since this page is littered with large emphasis, MSIE is not behaving according to the spec.

Conclusion

Stylesheet authors cannot be expected to have to deal with buggy error handling in older browsers. In four years, when CSS4 is released and it does define things like atthree-dee, highlighted and !, authors will be severely limited because of IE4's poor error-handling.