An IE6 CSS float bug stumper

[Drew D. Saur]

Hello, all.

I have searched and searched and searched for details about what I am
experiencing, but I can't find a reference anywhere. I know IE has some
interesting bugs regarding floats - many of which the insane "display:
inline" will fix - but this one us a real stumper.

Visit:

http://www.macorchard.com/junk/bug/

The CSS file is located at:

http://www.macorchard.com/junk/bug/mo.css

....in IE6 - and then in any other modern browser - and you will see that
the left-floated element has space above and below it (margin space,
essentially) that IE insists on displaying. No amount of work - apart from
disabling the left float completely - seems to affect this.

Any help with this would be greatly appreciated. Thanks!

Drew

[Els]

Re: An IE6 CSS float bug stumper

Drew D. Saur wrote:
[color=blue]
> Hello, all.
>
> I have searched and searched and searched for details about what I am
> experiencing, but I can't find a reference anywhere. I know IE has some
> interesting bugs regarding floats - many of which the insane "display:
> inline" will fix - but this one us a real stumper.
>
> Visit:
>
> http://www.macorchard.com/junk/bug/
>
> The CSS file is located at:
>
> http://www.macorchard.com/junk/bug/mo.css
>
> ...in IE6 - and then in any other modern browser - and you will see that
> the left-floated element has space above and below it (margin space,
> essentially) that IE insists on displaying. No amount of work - apart from
> disabling the left float completely - seems to affect this.[/color]

The reason is collapsing margins, and adding a border on div.App
solves it.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Drew D. Saur]

Re: An IE6 CSS float bug stumper

Els <els.aNOSPAM@ti scali.nl> wrote in
news:dr6av9apu8 tr$.dlg@locusme us.com:
[color=blue]
> Drew D. Saur wrote:
>[color=green]
>> Hello, all.
>>
>> I have searched and searched and searched for details about what I am
>> experiencing, but I can't find a reference anywhere. I know IE has
>> some interesting bugs regarding floats - many of which the insane
>> "display: inline" will fix - but this one us a real stumper.
>>
>> Visit:
>>
>> http://www.macorchard.com/junk/bug/
>>
>> The CSS file is located at:
>>
>> http://www.macorchard.com/junk/bug/mo.css
>>
>> ...in IE6 - and then in any other modern browser - and you will see
>> that the left-floated element has space above and below it (margin
>> space, essentially) that IE insists on displaying. No amount of work
>> - apart from disabling the left float completely - seems to affect
>> this.[/color]
>
> The reason is collapsing margins, and adding a border on div.App
> solves it.
>[/color]

Thanks, Els! - I did as you stated and came up with
http://www.macorchard.com/junk/bug2/ - and while I do have a good grasp
of collapsing margins, I am stumped regarding why *adding* a border helps
in this case. If you have a moment to clarify further, I would appreciate
it. Thanks!

Drew

[Els]

Re: An IE6 CSS float bug stumper

Drew D. Saur wrote:
[color=blue]
> Els <els.aNOSPAM@ti scali.nl> wrote in
> news:dr6av9apu8 tr$.dlg@locusme us.com:
>[color=green]
>> Drew D. Saur wrote:
>>[color=darkred]
>>> Hello, all.
>>>
>>> I have searched and searched and searched for details about what I am
>>> experiencing, but I can't find a reference anywhere. I know IE has
>>> some interesting bugs regarding floats - many of which the insane
>>> "display: inline" will fix - but this one us a real stumper.
>>>
>>> Visit:
>>>
>>> http://www.macorchard.com/junk/bug/
>>>
>>> The CSS file is located at:
>>>
>>> http://www.macorchard.com/junk/bug/mo.css
>>>
>>> ...in IE6 - and then in any other modern browser - and you will see
>>> that the left-floated element has space above and below it (margin
>>> space, essentially) that IE insists on displaying. No amount of work
>>> - apart from disabling the left float completely - seems to affect
>>> this.[/color]
>>
>> The reason is collapsing margins, and adding a border on div.App
>> solves it.
>>[/color]
>
> Thanks, Els! - I did as you stated and came up with
> http://www.macorchard.com/junk/bug2/ - and while I do have a good grasp
> of collapsing margins, I am stumped regarding why *adding* a border helps
> in this case. If you have a moment to clarify further, I would appreciate
> it. Thanks![/color]

Thinking again, maybe it wasn't a legitimate collapsing margins issue
- that would have had IE do what you like, instead of the other
browsers.

It reminded me of collapsing margins, because adding a border to
div.App keeps the top margin of div.App from collapsing with the top
margin of body. If you compare your two examples, you can see that the
floated element doesn't change place, but the div.App doesn't extend
to the top of body anymore in the second example.
Borders and paddings stop margins from collapsing into the elements so
to speak.

The weird bit, is the bottom margin of the floated h2, which seems to
be effected by what happens to the top margin for some reason.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Drew D. Saur]

Re: An IE6 CSS float bug stumper

Els <els.aNOSPAM@ti scali.nl> wrote in
news:d0b8t1de0r 01.dlg@locusmeu s.com:
[color=blue]
> Thinking again, maybe it wasn't a legitimate collapsing margins issue
> - that would have had IE do what you like, instead of the other
> browsers.
>
> It reminded me of collapsing margins, because adding a border to
> div.App keeps the top margin of div.App from collapsing with the top
> margin of body. If you compare your two examples, you can see that the
> floated element doesn't change place, but the div.App doesn't extend
> to the top of body anymore in the second example.
> Borders and paddings stop margins from collapsing into the elements so
> to speak.
>
> The weird bit, is the bottom margin of the floated h2, which seems to
> be effected by what happens to the top margin for some reason.
>[/color]

Yes, and that was really what "stumped" me to begin with! Frankly, in the
design that I had, the top margin wasn't causing a problem for me (the
samples were snipped from a larger context) - it was the space below, which
your border trick did indeed solve, but as I think you will agree, it is at
odds with the typical collapsing margin bugs.

It can't be that I have stumbled across an otherwise unknown IE bug, can
it? That seems impossible....

Does anybody else know what's going on here?

Drew

[Drew D. Saur]

Re: An IE6 CSS float bug stumper

In article <Xns9708A615B7A A1dsaurfusionpr oductio@24.24.2 .167>,
"Drew D. Saur" <dsaur@fusionpr oductions.com> wrote:
[color=blue]
> Els <els.aNOSPAM@ti scali.nl> wrote in
> news:d0b8t1de0r 01.dlg@locusmeu s.com:
>[color=green]
> > Thinking again, maybe it wasn't a legitimate collapsing margins issue
> > - that would have had IE do what you like, instead of the other
> > browsers.
> >
> > It reminded me of collapsing margins, because adding a border to
> > div.App keeps the top margin of div.App from collapsing with the top
> > margin of body. If you compare your two examples, you can see that the
> > floated element doesn't change place, but the div.App doesn't extend
> > to the top of body anymore in the second example.
> > Borders and paddings stop margins from collapsing into the elements so
> > to speak.
> >
> > The weird bit, is the bottom margin of the floated h2, which seems to
> > be effected by what happens to the top margin for some reason.
> >[/color]
>
> Yes, and that was really what "stumped" me to begin with! Frankly, in the
> design that I had, the top margin wasn't causing a problem for me (the
> samples were snipped from a larger context) - it was the space below, which
> your border trick did indeed solve, but as I think you will agree, it is at
> odds with the typical collapsing margin bugs.
>
> It can't be that I have stumbled across an otherwise unknown IE bug, can
> it? That seems impossible....
>
> Does anybody else know what's going on here?
>
> Drew[/color]

Any takers here?

Did I really find a new major bug in IE6? I find that hard to believe,
but if I did, I would like to report it....

Drew

--
The Mac Orchard - http://www.macorchard.com/
Essential Internet Applications since 1995

[Stephen Poley]

Re: An IE6 CSS float bug stumper

On Thu, 10 Nov 2005 18:57:38 GMT, "Drew D. Saur" <dsaur@macorcha rd.com>
wrote:
[color=blue]
>In article <Xns9708A615B7A A1dsaurfusionpr oductio@24.24.2 .167>,
> "Drew D. Saur" <dsaur@fusionpr oductions.com> wrote:
>[color=green]
>> Els <els.aNOSPAM@ti scali.nl> wrote in
>> news:d0b8t1de0r 01.dlg@locusmeu s.com:
>>[color=darkred]
>> > Thinking again, maybe it wasn't a legitimate collapsing margins issue
>> > - that would have had IE do what you like, instead of the other
>> > browsers.[/color]
>>
>> Yes, and that was really what "stumped" me to begin with! Frankly, in the
>> design that I had, the top margin wasn't causing a problem for me (the
>> samples were snipped from a larger context) - it was the space below, which
>> your border trick did indeed solve, but as I think you will agree, it is at
>> odds with the typical collapsing margin bugs.
>>
>> It can't be that I have stumbled across an otherwise unknown IE bug, can
>> it? That seems impossible....
>>
>> Does anybody else know what's going on here?[/color]
>
>Any takers here?
>
>Did I really find a new major bug in IE6? I find that hard to believe,
>but if I did, I would like to report it....[/color]

Please don't get excited. If you can find a major area of IE that has
*no* bugs it will be time to get excited ...

Seriously: I haven't followed this in detail, but I had an incident with
IE a year ago when I had excessive spacing between elements. After
fighting it for a few hours I gave up - it didn't look too awful. While
tracking down another problem later I temporarily added a coloured
border to another unrelated element - and the spacing problem went away!
I was using a plain background, so I changed the border to the
background colour and left it there as a kluge. Whether this is related
to your problem here I'm not sure, but it could well be.

Really it's only worth documenting a bug if you can give a good analysis
of when it occurs (rather than a single example). Have you got that far?

And as for reporting it to Microsoft: save your breath. They don't give
a damn. (How long has peekaboo been around? Or 3px jog? Non-functioning
max-width? Non-functioning child selectors? A few hundred other things?)

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Tony]

Re: An IE6 CSS float bug stumper

>And as for reporting it to Microsoft: save your breath. They don't give[color=blue]
>a damn. (How long has peekaboo been around? Or 3px jog? Non-functioning
>max-width? Non-functioning child selectors? A few hundred other things?)[/color]

http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx

"In IE7, we will fix as many of the worst bugs that web developers hit
as we can, and we will add the critical most-requested features from
the standards as well. Though you won't see (most of) these until
Beta 2, we have already fixed the following bugs from
PositionIsEvery thing and Quirksmode:

Peekaboo bug
Guillotine bug
Duplicate Character bug
Border Chaos
No Scroll bug
3 Pixel Text Jog
Magic Creeping Text bug
Bottom Margin bug on Hover
Losing the ability to highlight text under the top border
IE/Win Line-height bug
Double Float Margin Bug
Quirky Percentages in IE
Duplicate indent
Moving viewport scrollbar outside HTML borders
1 px border style
Disappearing List-background
Fix width:auto"

They took their sweet time to do it, but it looks like it's happening -
finally

[Stephen Poley]

Re: An IE6 CSS float bug stumper

On 10 Nov 2005 14:09:10 -0800, "Tony" <tony23@dslextr eme.com> wrote:
[color=blue][color=green]
>>And as for reporting it to Microsoft: save your breath. They don't give
>>a damn. (How long has peekaboo been around? Or 3px jog? Non-functioning
>>max-width? Non-functioning child selectors? A few hundred other things?)[/color]
>
>http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx
>
>"In IE7, we will fix as many of the worst bugs that web developers hit
>as we can, and we will add the critical most-requested features from
>the standards as well. Though you won't see (most of) these until
>Beta 2, we have already fixed the following bugs from
>PositionIsEver ything and Quirksmode:
>
>Peekaboo bug
>Guillotine bug[/color]
<snip>
[color=blue]
>They took their sweet time to do it, but it looks like it's happening -
>finally[/color]


Thanks for that - that had passed me by.

I'm afraid however that the phrase "the critical most-requested features
from the standards" more or less confirms that they have absolutely no
intention of reforming. Wouldn't the phrase "comply with standards" have
made a nice change?

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Tony]

Re: An IE6 CSS float bug stumper

"Stephen Poley" <sbpoleySpicedH amTrap@xs4all.n l> wrote in message
news:uvj9n1tmv3 2l9l83dfg09jten esn7gsefn@4ax.c om...[color=blue]
> On 10 Nov 2005 14:09:10 -0800, "Tony" <tony23@dslextr eme.com> wrote:
>[color=green][color=darkred]
>>>And as for reporting it to Microsoft: save your breath. They don't give
>>>a damn. (How long has peekaboo been around? Or 3px jog? Non-functioning
>>>max-width? Non-functioning child selectors? A few hundred other things?)[/color]
>>
>>http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx
>>
>>"In IE7, we will fix as many of the worst bugs that web developers hit
>>as we can, and we will add the critical most-requested features from
>>the standards as well. Though you won't see (most of) these until
>>Beta 2, we have already fixed the following bugs from
>>PositionIsEve rything and Quirksmode:
>>
>>Peekaboo bug
>>Guillotine bug[/color]
> <snip>
>[color=green]
>>They took their sweet time to do it, but it looks like it's happening -
>>finally[/color]
>
>
> Thanks for that - that had passed me by.
>
> I'm afraid however that the phrase "the critical most-requested features
> from the standards" more or less confirms that they have absolutely no
> intention of reforming. Wouldn't the phrase "comply with standards" have
> made a nice change?[/color]

Given where they were, it would likely take quite a bit of recoding to fully
comply with standards. At least this is a step in the right direction - and
from what I read, they do seem to intend to continue in the direction of
standards compliance after this release.