Errors in spec on float, and improvements thereto

<blockquote>
<strong>In a block formatting context, each box's left
outer edge touches the left edge of the containing
block (for right-to-left formatting, right edges
touch).</strong> This is true even in the presence of
floats (although a box's content area may shrink due
to the floats).
[
This sentence seems to hold the key to it all:

This means that
<DIV style="float: left; width: 50%">
</DIV>
<DIV style="width: 50%">
</DIV>
would result in the second DIV having no room for its
content (since its left outer edge touches the left
edge of the containing block, and thus it is
overlapped entirely).

Thus it needs to be emphasised more heavily (rather
than not at all) that the content width of elements
adjacent to floats is the width of the containing
block - sum of all float widths, etc.

--------------------
                       |     | - white space
                       |     | 
                       |     |
                       |     | 
----------------      |
                              |
                              |
--------------------
]
...

<cite ref="1">Any floated box becomes a block
box</cite>

that is shifted to the left or right until its outer
edge touches the containing block edge or the outer
edge of another float. 

The top of the floated box is aligned with the top of
the current line box (or bottom of the preceding <a
axis="1">block box</a> if no line box exists). 

[ Wrong.

1. Floated boxes have been defined as block boxes, so:
<div style="float: left;">
</div>
<div style="float: left">
</div>
would result in the second div aligned with the bottom
of the first.

Thus 'preceding block box' should be changed to
'preceding non-floated block box'.

However this does not cater for this:

<div>
Hello
<div style="float: left;">
</div>
<div style="float: left">
</div>
</div>

According to the revised definition, the second div
would go above Hello, so the definition should be
further revised to:
'
The top of the floated box is aligned with the top of
the current line box (or to whichever is further down
the document of the preceding non-floated block box or
line box not in a floated box, if no line box exists).
'
]

If there isn't enough horizontal room on the current
line for the float, it is shifted downward, line by
line, until a line has room for it.
[
This is where my distinction between floated inline
boxes and floated block boxes comes in - you could
hardly move this down line by line:
<div style="width: 60%; float: left">
</div>
<div style="float: left; width: 50%">
</div>
]
<cite class="ref">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. </cite>

However, line boxes created <cite ref>next to</cite>
the float are shortened to make room for the floated
box.

[
Since subsequent non-positioned block boxes flow
vertically as if the float didn't exist, their line
boxes are not "next to" the float, but are underneath
it (or above it, if you prefer). 

As a result, according to this, subsequent
non-positioned block boxes suffer overlapping text.
(Note that Netscape 4.* seems to follow this
mis-definition)
----------------
The ref paragraph should be changed to:

<cite class="ref">Since a float is not in the flow,
[non-floated] non-positioned [and relatively
positioned] block boxes created before and after the
float box flow vertically [and horizontally] as if the
float didn't exist. [However, inline elements
(including line boxes inside block elements) are
displaced by the float, and line boxes may be
shortened.]</cite>

This would be a great improvement, particularly the
last sentence.
]


Any content in the current [?] line before [?] a
floated box is reflowed in the first available line on
the other side of the float.
[
Not fine:
E.g.
<p>
1. An exam question. <span style="float: right">25
marks</span>
</p>

Presumably 'current line' should read the 'line from
which the floated box was displaced'.

Passing over this inclarity, the result of the
sentence is that "An exam question" goes on the next
line.

So it should read:
Where a floated box is floated from a line box, the
element is reflowed from the beginning of the line box
from which the float was displaced, flowing around the
float as if it were a part of the margin.
]

...

If the current box is left-floating [ultra-pedantic
grammatical point - the predicate should not be
hyphenated], 

and there are any left floating [but the attribute
should] boxes 

...
9.5.2 Controlling flow next to floats: the 'clear'
property
...
This property indicates which sides of an element's
box(es) [?] may not be adjacent to an earlier floating
box. <em>(It may be that the element itself has
floating descendants; the 'clear' property has
<strong>no effect</strong> on those.)</em>
[
<div class="leftfloat">
</div>
<div class="clear">
<div class="leftfloat">
</div>
</div>
-------------
             |
             |
             |
-------------|
-------------------------
Cleared element here |
--------------                 |
float here (where?)    |
                                      |
--------------------------
The float in the clear should be floated left in the
clear, not floated next to the first DIV. In the first
(correct) case, clear has had an effect.
]

</blockquote>
--------
Finally, what of the situation where the float's
content is wider than it.

In my opinion, this should displace adjacent elements
to the float, but the spec mentions nothing of this
(except from mentioning elsewhere that elements can
overflow their block)
-----
Note that there is an error in the picture at 9.8.3.
The top of the floated box is shown aligned with the
bottom of the text on the previous line, and the
bottom of the floated box is shown aligned with the
text on that line. This is completely wrong. The top
of the floated box should be aligned with the line box
that it shortens. Thus the border box (though not the
text box) is half-leading too far up. Equally for the
picture at 9.8.4. (although the fact that the example
here is a nonsense is a more important consideration)



=====
----------------------------------------------------------
From Matthew Brealey (http://members.tripod.co.uk/lawnet (for law)or http://members.tripod.co.uk/lawnet/WEBFRAME.HTM (for CSS))
__________________________________________________
Do You Yahoo!?
Bid and sell for free at http://auctions.yahoo.com

Received on Thursday, 11 November 1999 11:17:00 UTC