Why does my page not display correctly in Internet Explorer 6?

Question

I created a simple page with a series of divs. In all of the modern browsers, it appears fine, but in Internet Explorer 6, it falls apart. I have no idea what is causing it to happen.

You can view the page here: IE 6 Test Page

If you have IE6 installed, I included the Firebug Lite JS file on the page, so just click the firebug icon in the bottom right corner to inspect an element.

Here's a screenshot using Browserlab to view the page in Firefox and IE6: Comparison Screenshot

The 3rd div named 'content'(With the Manager Email field) moves everything to the right forcing the next div to the next line. Also, none of the row div's reach all the way across as they should(see Comparison Screenshot)

I did some research and have found that there is some problems in IE6 using floats which I use here, but I'm not sure how to fix it.

Why does my page not display correctly in Internet Explorer 6? And better yet, how can I fix it? :)

Answer 1

It looks like the third div isn't clearing the float properly. Perhaps give each of the row divs the style clear: both

Answer 2

Do you really need to support IE6? Even Microsoft is fighting it nowadays and the market share is starting to be irrelevant except for China.