Re: Flow around floats (proposal for float-displace)

>Date: Wed, 13 Jan 1999 14:54:49 +0000 (BST)
>From: Ian Hickson <py8ieh@bath.ac.uk>
>Subject: Re: Flow around floats (proposal for float-displace)
>
>On Sun, 27 Dec 1998, L. David Baron wrote [1]:
>> Property: float-displace
>> Value: none | inline | jaggedbox | box
>> [.....]
>> jaggedbox:
>> Block boxes are displaced by the floating element, and may have
>> irregular shapes if the floating element is only next to part of the
>> box (that is, that there is some horizontal split in the content of
>> the box that would mean only one of the two boxes created by the
>> split would be displaced by the float). All block-level children of
>> an element whose displace value is jaggedbox are also treated as
>> though they have the value jaggedbox (unless they have the value
>> box), and are formatted accordingly. Top margin, border, and padding
>> is applied at every top edge of the box, and equivalently for right,
>> bottom, and left margin border and padding.
>>   NOTE:  This is the current behavior of MS Internet Explorer 4 and
>>   5.0 beta, or at least similar to it.
>
>I have serious doubts about whether this is a good idea; irregular
>padding, margins and borders are *very* complicated to implement (and
>their visual appeal leaves much to be desired too, IMHO).

I don't think they would be much different in implementation from flow
of inline elements around floats (which, I admit, is difficult, but it
has already been done).  Furthermore, this would probably be used
mainly when there was no border and the background was transparent.  If
authors want to use it in other cases, the rules need to be defined.
(We can't stop people from picking ugly color schemes, either.)

>This behaviour is *not* IE4's behaviour: in IE only the markers are
>moved by floats, not the border/padding/margin.

The padding certainly is moved by floats in in [3].  IE5 beta 2 shows
an reverse-L-shaped yellow "box".  I think you were probably thinking
of examples where the float was inside the element.

>I believe this problem is resolved in a much simpler manner by my
>redefinition of marker-offset's calculations [2].

However, there are many other problems that will result from rendering
of floats fully in compliance with the CSS2 spec.  We haven't yet seen
a browser that does this, so I don't think we fully understand the
implications.  The only one that is even attempting to handle flow
around floats as defined in the spec is NGLayout.  Opera and IE both
handle the problem by deviating from the spec, in different ways.  I
suspect NGLayout will have to handle floats in a different way because
people will see the correct handling as a bug.

Here are some examples where this would be useful:

jaggedblock:
  UL, OL, DIR, MENU - To prevent bullets from being over image and to
    keep the indentation of the LI elements relative to surrounding
    text.
  DL - To keep the DD elements indented relative to the DT elements.
  BLOCKQUOTE - To differentiate it from the rest of the text (this is
    especially a problem if there are floats on both sides).
block:
  HR - To prevent the HR from sticking out in the margin of a floated
    image (on the opposite side of the image)

A further problem for redefining marker-offset is that it is not
backward-compatible:  it requires drawing LI borders in a different
way.  It also requires knowing the padding on the UL element in order
to set the margin correctly on the floating element to get the exact
behavior that would be expected (with jaggedbox).  This is impossible
when there are user stylesheets.

One further note that I forgot last time:  jaggedblock cannot work on
a table or any table elements.  Therefore, were it set on a table or
any table elements, it would be treated as block.

David Baron

>References:
>[1]: http://lists.w3.org/Archives/Public/www-style/1998Dec/0082.html
>[2]: http://lists.w3.org/Archives/Public/www-style/1998Dec/0066.html

[3] http://www.w3.org/Style/CSS/Test/current/sec5526b.htm

>Related resources:
>http://lists.w3.org/Archives/Public/www-style/1998Dec/0065.html
>http://lists.w3.org/Archives/Public/www-style/1998Dec/0079.html
>http://lists.w3.org/Archives/Public/www-style/1998Dec/0083.html
>http://www.bath.ac.uk/%7Epy8ieh/internet/projects/wwwstyle/MarkerNearFloatSuggestion.html

Received on Wednesday, 13 January 1999 10:46:29 UTC