Margin values are added to your block element width, not included in that
width. So you've set a width of 49%, plus a margin of 2%, for a combined
width of 51% for each column.
Your total layout width is 102%, so it is not surprising that the float is
not working properly.
Try a width of 48% instead, and that should clear up your problem. That's
assuming no padding values or borders are involved, since they too are added
to the block element width. To calculate total widths, use this formula:
left margin width + left border width + left padding width + block width +
right padding width + right border width + right margin width = Total width
Carmen
On 10/11/05, Jørgen Farum Jensen <[EMAIL PROTECTED]> wrote:
>
> I have a problem with the following css:
>
> #colleft {
> text-align:justify;
> width:49%;
> float:left;}
> #colright {
> text-align:justify;
> width:49%;
> float:left;
> margin-left:2%;}
>
> This a two-column layout which works well in for example Firefox, but not
> so well in Internet Explorer, which insists on a sum of the widths which
> is
> smaller than 100 percent.
>
> This makes it impossible to get the floated columns to line up with header
> and footer, se example page at
>
> http://www.webdesign101.dk/x/cssdiscuss/ex1.html
>
> It would be nice to have some sort of explanation for this behavior,
> perhaps even a better remedy than the one I have used, to pass a smaller
> margin width to IE?
>
> Best regards
>
> Jørgen Farum Jensen
> www.webdesign101.dk <http://www.webdesign101.dk>
> ______________________________________________________________________
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org <http://evolt.org> --
> http://www.evolt.org/help_support_evolt/
>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
