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

Problems with 'float' in Internet Explorer 4.5 for Macintosh

The following examples of incorrectly supported floating elements are taken from section 4.1.4 of the World Wide Web Consortium's CSS1 Test Suite.

IE 4.5 does not fail all of the tests on the W3C test page, in particular it supports floating of images better than it does floating of block elements.

Note that your window must be at least 640 pixels wide to see this problem! This DIV should be 640 pixels wide - make sure that your window is wider than this DIV to see the problems depicted below!

1. Floating Paragraphs in a DIV

1.1 Left - Right

This is a left-floating paragraph (first in source).

This is a right-floating paragraph (second in source).

MacIE incorrectly puts a space above the floating paragraph that occurs first. (The margin is explicitly set to 0.) The left floating paragraph should touch the top of the purple div just as the right floating one does. The right floating paragraph should stay entirely within the top and side borders of the div, but it does not. For some reason, it sticks out of the right side of the div.

1.2 Right - Left

This is a right-floating paragraph (first in source).

This is a left-floating paragraph (second in source).

This example is similar to the previous one, except the right float comes first. This shows that the extra space on top accompanies the first float, but the additional movement to the right occurs on right-floating paragraphs.

2. Floating elements inside fixed width DIVs

2.1 Paragraphs

This is a left-floating paragraph (first in source).

This is a right-floating paragraph (second in source).

In this example, MacIE shows a very serious problem with floats. Floating should be a safe technique - when implemented correctly, floats can never overlap, and authors do not need to worry about overlap in unusual situations. However, MacIE does not displace a right-floating element down when this displacement is needed to separate it from a left-floating element. Instead, these elements overlap. Furthermore, MacIE begins the text in the normal flow where there is no room for it, putting one word per line until the floats are complete.

2.2 Images

[This image should float to the left of the paragraph] [This image should float to the right of the paragraph] This example demonstrates the same problem with overlap, except with images. The images overlap in the same way the paragraphs do, and the text has the same problem flowing in the midst of the images.