"User agents should allow users to select from alternate style sheets." Although within the HTML specification for years, Microsoft browsers still lack the corresponding menu. However all alternate stylesheets are loaded in memory, where they remain pretty useless without some extra effort by the page designer to supply a selector specifically for users of these standards offending browsers.
Paragraph 1, floated: This text should appear at the top left corner. The blue area should stretch out 12 pixels below the text. There are no margins or borders around this area.
Text 2, floated: This text should appear right below text 1. It is the content of a span
contained in
paragraph 2.
Text 3, normal flow: This text should appear at the top to the right of text 1 and wrap around texts 1 and 2
at the bottom when long enough.
Paragraph 3: Some text in normal flow with clear:both
.
Explanation: Paragraph 1 is floated to the left
and thus taken out of the normal flow. The current line of normal flow therefore remains
at the top of the containing block. The following paragraph
in normal flow should therefore start at the top.
This paragraph's first child is a span
again floated to the left. Setting clear:left
makes this span
containing
text 2 float below paragraph 1. It's top should touch the bottom of the former, because paragraphs
have been defined to have no margins or borders. There is only a bottom padding that causes the dark blue and grey areas stretching out 12 pixels below the
text of the corresponding paragraph.
Finally follows some content of paragraph 2 in normal flow
(text 3). It should start at the top of this paragraph to the right of paragraph 1.
IE 6 however will place paragraph 2 below paragraph 1. Therefore text 3 appears to the right of text 2 in this browser, while the much earlier IE 5.0 (Mac) performs correctly.
Funny enough, giving paragraph 2 a top border makes IE 6 suddenly behave correctly
(though it also removes any bottom margin
of paragraph 1 as has been found in further tests):
Paragraph 1, floated: This text should appear at the top left corner.
Text 2, floated: This text should appear right below text 1.
Text 3, normal flow: This text should appear at the top to the right of text 1 and wrap around texts 1 and 2
at the bottom when long enough.
Setting border-top:1px dotted transparent
makes IE 6 suddenly avoid inserting the extra space and place paragraph 2 and this text
correctly.
Paragraph 3: Some text in normal flow with clear:both
.
The top border in the last example above will not be visible in CSS-compliant browsers since it's color has been set to transparent
. IE 6 uses the
foreground color instead (that has been set to 'red' before). Again IE 5.0 (Mac) draws 'transparent' borders as expected.
The following paragraph will never grow wider than 400px in CSS-compliant browsers. Not so in IE 6 that ignores the corresponding attributes.
This paragraph will never grow wider than 400px in CSS-compliant browsers. Not so in IE 6 that ignores the corresponding attributes. This paragraph will never grow wider than 400px in CSS-compliant browsers. Not so in IE 6 that ignores the corresponding attributes.
This italic text should be green. However it won't in IE 6 since this browser doesn't implement CSS attribute selectors.
The W3C Document Object Model allows to generate links (like any other elements) on the fly.
Add Link to top of page (requires JavaScript to be enabled).
May be useful, you think? However the links created by IE 6 this way will never work... (Once again IE 5.0 (Mac) gives no reason for complaining.)