Previous Message
Next Message

Site Check

Sent by Michael Landis on 2 October 2003 21:09


Andrew wrote:

> Isn't this the opposite of what is happening? The left edge of the text
> box seems to actually be sliding under the right edge of the picture in
> both Opera and Firebird (don't have NN to test with).

Sorry for the confusion -- what I was trying to describe is exactly what
you are describing -- the left edge of the text box slides underneath the
floated element, but the *text* does not. This is what the specs describe
in http://www.w3.org/TR/REC-CSS2/visuren.html#floats (third paragraph):

"Since a float is not in the flow, non-positioned block boxes created
before and after the float box flow vertically as if the float didn't
exist. However, line boxes created next to the float are shortened to make
room for the floated box."

Line boxes are defined in
http://www.w3.org/TR/REC-CSS2/visuren.html#inline-formatting as the area
taken by a row of inline elements (such as text and inline images). So
basically, the specs say that block elements should pretend the float
doesn't exist, but inline content within the block should shift to make
room for the float.

> Left padding the text box to 300px doesn't solve this. The text box seems
> to respect the right edge of the float when you try the left padding.

This makes sense as well. Since the padding is added to the block box
(which starts behind the float), it doesn't change the line boxes'
positions until the padding pushes them further than the float does.

By using 300px left margin instead of left padding, you are moving the edge
of the block box out from under the float in every browser, so
Gecko/Opera/Safari end up looking the same as IE.

> All of which suggests some strange combination of cascade is causing IE6
> to create the gap.

Unfortunately it's much simpler than that -- IE just doesn't obey the specs
on floating. :-) Instead of moving the lines of text within the unchanged
block element, IE moves the block element itself. Adding margin instead of
padding causes all browsers to move the block element, so everyone plays by
the same rules.

HTH,

MikeL

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Possibly related: