From: "George Smyth" [EMAIL-REMOVED]>
Date: Mon, 27 Jun 2005 15:23:35 -0400
>I am putting together a site that can currently be viewed at
>http://sacc-jobfaircom.readyhosting.com/. As far as Firefox is
>concerned, everything is working just fine. However, in Internet
>Explorer the three boxes with the images do not fit across. I thought
>that this might be due to the IE Doubles Float Margin bug, but I added
>display:inline to the <div> without any change.
>Does anyone have an idea as to why the third box is dropping below the
>other two? If I increase the size of the main <div> then they fit, but
>Firefox will show the extra spacing following the third box.
The xml declaration at the beginning of your page has put IE6 into quirks rendering mode. In this
mode, IE6 uses the same broken box model as it's predecessors. The border and padding of the
containing div do not expand the div but take up part of the 472px total. So, even though the
content adds to 472px as well, it really has only 466px-worth of space to display in, which is not
enough (472px/container-width - 1px/left-border - 2px/left-padding - 2px/right-padding -
1px/right-border = 466px).
To fix this (for IE6) you can remove the xml declaration. Alternately, you will need to write
separate width settings for the IEs as you have discovered since both IE5 and IE5.5/Win display the
same way that IE6 does now. You can use the Tan hack (star HTML selector bug) to target only IE,
however you'll probably want to hide that from IE5/Mac, as it doesn't have an incorrect box model
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/