[thelist] CSS: IE6 width oddness

Gary McPherson genyus at ingenyus.net
Sat Aug 16 19:16:50 CDT 2003


Hi all. Came across a very strange glitch today that I managed to figure
out as I was writing a plea for assistance to the list, but I thought
I'd share it with everyone to see if it's been experienced elsewhere.

It boils down to this:
<div style="width:100%;margin:0;padding:0;">
	<span
style="background:yellow;width:50%;margin:0;padding:0;border:0;float:lef
t;">50%</span>
	<span
style="background:red;width:50%;margin:0;padding:0;border:0;float:left;"
>50%</span>
</div>

I was expecting those lines (or their equivalent) to produce two spans
alongside each other on a single line, and while it worked as expected
in NS/Moz, IE6 refused to put them on a single line without some
reduction in the width of at least one span. I tried altering padding,
margins, borders, different doctypes - it just wasn't happening. Then I
changed the float of the second span to "right" and I noticed that while
it was still sitting below the first (but now on the opposite half of
the screen), there appeared to be a one-pixel overlap.

In a flash of momentary inspiration, I resized the window and voila -
adjacent spans. Continuing to slowly resize using the mouse the spans
continued to jump up and down as the 50% calculation encountered odd and
even pixel widths. Now I don't know which was more frustating - the time
I'd wasted because of the chance sizing of my window or the fact that,
despite Micr$oft's many billions, they seem unable to deal with the
division of an odd number properly...

Cheers,

Gary




More information about the thelist mailing list