CSS image float div in IE6

In the bottom cap of this page (bottom with corners) I seem to be having a weird IE6 issue. I've tried Google with no luck, as really, how do you ask this question.

In IE6, the corner images开发者_Python百科 that are floated left and right seem to cause the whitespace to drop.

http://www.duncanhadleytriathlon.ca/

Any suggestions for why this may be?

Are you using paddings? If so, you must subtract the padding from your other values (left/right). I don't know if it helps or not but I noticed that there is also an issue (probably the same one that you said) in Firefox 3.6.3. I suggest you use the DD_roundies javascript for making rounded corners in IE browsers. It can be found at: www.dillerdesign.com/experiment/DD_roundies/

[Edit]: The issue that i said is about the green panel's rounded corner at the bottom of the page.

My suggestion would be to use position: absolute to place the images instead.

Other ideas would be:

• Drop #mtmi and just make the background of #mtm white (you'd need to modify the images to make the background black instead of transparent.
• Even possibly drop #mtm and but the images directly in #main
• Ignore old browers and use CSS3 rounded corners.