The pages linked to below test how well a browser supports the different elements, attributes, and features of HTML 4.01. The organization of the tests is somewhat based on the chapters of the W3C specification. Some attributes and elements that affect text style, etc. have been deprecated in favor of using Cascading Style Sheets (CSS), but the pages below test them anyway, since older web pages may still use them, and a browser should be able to handle them. All of the pages linked to below are valid HTML 4.01 Transitional, so they don't test how well a browser handles bad HTML syntax. The original purpose of these pages was so new browsers (or versions of existing ones) could be tested. However, it is also possible to use the results below to help know what to avoid when making webpages that work in all major browsers.
If you have questions, suggestions for improvements, other browsers to test, think my result expectations are off, etc., you can e-mail me about them: mauvecloud at mauvecloud dot net (mailto link avoided to discourage spam generators).
Test Name | Internet Explorer 6 (IE6) | Internet Explorer 7 (IE7) | FireFox 2.0 (FF2) |
---|---|---|---|
3.2.1 Elements | Y | Y | Y |
3.2.3 Character References | Y | Y | Y |
3.2.4 Comments | B | B | Y |
IE6 and IE7 both incorrectly treat "<!-->" and "<!--->" | |||
B.3.1 Line Breaks | N | N | N |
All three browsers give the bold text its own line, in clear violation of the specification quoted above on that page. | |||
B.3.5 Marked Sections | N | N | Y? |
Both IE6 and IE7 display { < << <<< <<<< <<<<< <<<<<< <<<<<<<]]>}, but FF2 displays {}, which could be correct. | |||
B.3.6 Processing Instructions | Y | Y | Y |
B.3.7 Shorthand Markup | N | N | P |
FF2 supports the closed start tag, but none of the others. | |||
5 HTML Document Representation | Y | Y | Y |
6.5 Colors | Y | Y | Y |
Extended Colors | Y | Y | Y |
Wikipedia Colors | B | B | N |
FF2 simply ignores these colors and leaves the background white, but both IE6 and IE7 accept all color names, only the colors produced are not appropriate to the names. | |||
6.6 Lengths | B | B | P |
None of the three browsers render the mismatching total sizes the way I would expect, and both IE6 and IE7 allow "*" and "0*" widths to grow to maximum possible width. | |||
7.4.1 The HEAD Element | Y | Y | Y |
7.4.2 The TITLE Element | Y | Y | Y |
7.4.3 The TITLE Attribute | Y | Y | Y |
7.4.4 Meta data | N | N | Y |
7.5.1 The BODY Element | Y | P | Y |
In FF2, I can hold down the mouse button on the link for the "active" test and it immediately blends in. In IE6, I can hold the mouse button over the link and move it away before releasing the button to make it blend in, but I could not make the link blend in in IE7. | |||
7.5.2 Element Identifiers | Y | Y | Y |
7.5.4 Grouping Elements | Y | Y | Y |
7.5.5 Headings | Y | Y | Y |
7.5.6 The ADDRESS Element | Y | Y | Y |
8.1.2 Inheritance of Language Codes | U | U | Y |
8.2.3 Setting the direction of embedded text | ? | ? | ? |
8.2.4 Overriding the Bidirectional Algorithm | ? | ? | ? |
All three browsers tested handled the direction tests in a way that seems illogical to me, but since they all used the exact same way, I may be misunderstanding the direction handling described in the HTML specification. If someone can direct me to a better explanation (see my contact info near the top of the page), I can fix these tests. | |||
8.2.5 Character references for directionality and joining control | Y | Y | Y |
9.1 White Space | Yb | Yb | Yb |
All three browsers collapse the extra whitespace, but underline the space after "Underlined Text" on the second line, even though there is whitespace after the span that provides the underlining. | |||
9.2.1 Phrase Elements | P | Y | Y |
IE6 does not recognize "ABBR" as a valid element, though IE7 and FF2 do. | |||
9.2.2 Quotations | B | B | Y |
IE6 and IE7 both style the Q element (indicating they consider it valid), but fail to add any sort of quote marks. Long Live the Q Tag describes one possible workaround, and mentions some alternatives if you don't like that one. | |||
9.2.3 Subscripts and Superscripts | Y | Y | Y |
9.3.1 Paragraphs | Y | Y | Y |
9.3.2 Controlling Line Breaks | Y | Y | Y |
9.3.3 Hyphenation | Y+ | Y+ | N |
One of the few cases where IE does better than FF2 at following the specification. Both IE6 and IE7 allow lines to break on hard hyphens, but FF2 doesn't break the lines at either. | |||
9.3.4 Preformatted Text | Y | Y | Y |
9.4 Making Document Changes | Yb | Yb | Yb |
The specification states that "These two elements are unusual for HTML in that they may serve as either block-level or inline elements (but not both)." Therefore, it is not surprising that none of the three browsers tested could treat them as block-level elements. | |||
Chapter 10 - Extra-Deep Nesting Tests | Y | Y | Y |
Chapter 10 - Extra-large Values Test | B | B | B |
None of the browsers size the lists to make the alphabetic or roman numeral entries fit. All three browsers switch to arabic numerals when the roman numerals hit 4000. Most roman numeral conversion algorithms that accept 4000 make it MMMM, but MV (should be a line over the V), or MIƆƆ may be acceptable alternatives (see the Wikipedia article). Also, both IE6 and IE7 only show the last three digits of arabic numerals. | |||
11.2.1 The TABLE Element | Y | Y | Y |
11.2.2 Table Captions | Yb | Yb | Y |
The "left" and "right" alignments specify that the caption should be at the left and right of the table, respectively, not at the top aligned with the left and right of the table, as IE6 and IE7 render them. | |||
11.2.3 Row Groups | Y | Y | Y |
11.2.4 Column Groups | Yb | Yb | Yb |
FF2 ignores alignment on columns and groups, while IE6 and IE7 mishandle relative widths. | |||
11.2.5 Table Rows | Y | Y | Y |
11.2.6 Table Cells | Y | Y | Y |
11.3 Table Formatting by Visual User Agents | Yb | Yb | Yb |
Specification gives no reason for frame=box to ever be interpreted differently than frame=border, but in all three browsers tested, rules=all causes frame=border to act exactly like frame=void. | |||
11.3.2 Horizontal and Vertical Alignment | P | P | P |
None of the three browsers tested supported either in-cell valign or character alignment. | |||
11.3.3 Cell Margins | Y | Y | Y |
12.2.1 Syntax of anchor names | Y | Y | Y |
12.2.3 Anchors with the id Attribute | Y | Y | Y |
12.2.4 Unavailable and unidentifiable resources | P | P | P |
All three browser inform the user that it couldn't find the document, but none of them "allow the user to intervene and identify the document type." | |||
12.3.1 Forward and Reverse Links | N | N | P |
IE6 and IE7 both have "Links" toolbars, but these do not pick up the LINK elements from the page that have urls for related content. FF2 shows the link values in the Page Info, but does not allow the user to click or double-click to visit any that are urls. | |||
12.3.2 Links and External Style Sheets | Y | Y | Y |
12.3.3 Links and Search Engines | N | N | Y |
12.4.1 Resolving Relative URIs | Y | Y | Y |
13.2 Including an Image | Y | Y | Y |
Generic Inclusion | B | B | Y |
Neither IE6 nor IE7 show an image in the OBJECT element here, and IE7 produces text to indicate it rejected the PNG image, which makes no sense considering it rendered the PNG image when it was in an IMG tag. | |||
13.3.1 Rules for rendering objects | Y | Y | Y |
13.3.2 Object Initialization | Y | Y | Y |
13.3.4 Object Declaration and Instantiations | B | B | B |
Neither IE6 nor IE7 will display either the JPEG image or the text contents of the OBJECT tag. FF2 displays the JPEG image before the anchor has been used. | |||
13.6.1 Client-side Image Maps | N | N | Y |
Neither IE6 nor IE7 display the image for the client-side image map. | |||
13.6.2 Server-side Image Maps | Y | Y | Y |
13.7.1 Width and Height | B | B | Y |
Images in OBJECT tags are supposed to be scaled, not put into scroll panes, as IE6 and IE7 do. | |||
Chapter 14 Style Sheets | Y | Y | Y |
15.2.1 Font Style Elements | Y | Y | Y |
Font Modifier Elements | Y | Y | P |
FF2 does not handle multiple BASEFONT elements, though there is nothing in the specification stipulating there can only be one BASEFONT element in a document. | |||
15.3 Rules | Y | Y | Y |
16.2.1 The FRAMESET Element | Yb | B | Y |
IE6 and IE7 both fail to render Frame 77, and IE7 draws frame borders inconsistently (none of the frames specify border details, so the borders should all look identical) | |||
16.2.2 The FRAME Element | P | P | Yb |
None of the three browsers tested treated the "margin" as a margin; all of them put the space inside the border instead of outside. IE6 and IE7 allow scrolling by selection in the frame that specified no scrolling. | |||
16.3.1 Specifying the Default Target for Links | Y | Y | Y |
16.3.2 Target Semantics | Y | Y | Y |
16.4.1 The NOFRAMES Element | U | U | U |
16.4.2 Long Descriptions of Frames | N | N | N |
16.5 Inline Frames | Yb | Yb | Yb |
None of the three browsers prevented the first iframe from scrolling, even though they were supposed to. The other features of iframes were fully supported. | |||
17.4.1 Control Types created with INPUT - Text | Yb | Yb | Y |
IE6 and IE7 do not truncate the specified value in the maxlength test, but do not allow text to be added until the content is shorter than the maxlength. | |||
17.4.1 Control Types created with INPUT - Size Tests | None of them provide enough room for 19 "M"s at size=20, but in IE7 and FF2, the CSS sized to width "20ex" and font set to 12 point field looks like it has room for one more "x". | ||
17.4.1 Control Types created with INPUT - Password | Yb | Yb | Y |
IE6 and IE7 do not truncate the specified value in the maxlength test, but do not allow text to be added until the content is shorter than the maxlength. | |||
17.4.1 Control Types created with INPUT - Checkbox | Y | Y | Y |
17.4.1 Control Types created with INPUT - Radio | Y | Y | Y |
17.4.1 Control Types created with INPUT - Submit | Y | Y | Y |
17.4.1 Control Types created with INPUT - Image | Y | Y | Y |
17.4.1 Control Types created with INPUT - Reset | Y? | Y? | Y? |
In radio button group "r2", the page loads with the third button checked, but resetting causes the first button (which had also been marked as checked in the source) to be checked instead. | |||
17.4.1 Control Types created with INPUT - Button | Y | Y | |
17.4.1 Control Types created with INPUT - Hidden | Y | Y | Y |
17.4.1 Control Types created with INPUT - File | Y | Y | Y |
17.5 The BUTTON Element | Yb | Yb | Yb |
None of the three browsers tested rendered the PRE on the button with the same positioning as the normal PRE below. | |||
17.6.1 Pre-selected options | B | B | B |
None of the three browsers handle these correctly: Only FF2 correctly allows individual options to be disabled, and only IE7 correctly picks up the "label" attribute. FF2 does not provide a scrolling mechanism for the size 1 multiple selects, and adds disabled scrollbars to the largest selects, which truncate the italicized group names in the hierarchical selects. | |||
17.7 The TEXTAREA Element | Y | Y | Y |
17.9.1 The LABEL Element | P | P | N |
In IE6, only the letter labels work (maybe it insists on the "for" attribute). In IE7, the "4" label works, but the "3" label doesn't. | |||
17.10 Adding Structure to Forms | Y | Y | Y |
17.11.1 Tabbing navigation | Y | Y | Y |
17.11.2 Access keys | Y | Y | Yb |
FF2 only accepts the access keys with both alt and shift, which doesn't make sense for 5 or period (because it could be interpreted as pressing Alt+% or Alt+>), and prevents the use of the access key for the tilde field. | |||
17.12 Disabled and Read-only controls - text | Y | Y | Y |
17.12 Disabled and Read-only controls - password | Y | Y | Y |
17.12 Disabled and Read-only controls - checkbox | P | P | P |
17.12 Disabled and Read-only controls - radio button | P | P | P |
There is a comment in the DTD that indicates "readonly" applies to text and password fields, but the specification says "The following elements support the readonly attribute: INPUT and TEXTAREA." That provides no excuse for browsers to fail to support "readonly" on check boxes and radio buttons, but all three fail that way. | |||
17.12 Disabled and Read-only controls - button | Y | Y | Y |
17.12 Disabled and Read-only controls - textarea | Y | Y | Y |
18 HTML Events - Body-specific Events | Y | Y | Y |
18 HTML Events - Generic Events | Yb | Yb | Yb |
None of the three browsers tested seemed able to distinguish "Key Press" from "Key Down". | |||
18 HTML Events - Element-specific events - Anchor | Y | Y | Y |
18 HTML Events - Element-specific events - Area | N | N | Y |
18 HTML Events - Element-specific events - Input | Y | Y | Y |
18 HTML Events - Element-specific events - Select | Yb | Yb | Y |
The specification makes it clear that IE6 and IE7 are doing this wrong: "The onchange event occurs when a control loses the input focus and its value has been modified since gaining focus. This attribute applies to the following elements: INPUT, SELECT, and TEXTAREA." IE6 and IE7 do not wait for a SELECT element to lose input focus before triggering this event. | |||
18 HTML Events - Element-specific events - Textarea | Y | Y | Y |
18 HTML Events - Element-specific events - Button | Y | Y | Y |