Lists around floats

The CSS spec's rules for rendering floats and the rules for rendering
lists yield what seems to me a strange conclusion.  Here is the
problem.  If a list has an element floating to its left (in ltr text),
the block elements (i.e., those with display block or list-item) are
not changed by the floating element; only the line boxes within them
are.  However, markers are offset (according to the marker-offset
property) from the border-edge of the list item.  Even if the section
on markers is ignored (as it can be for list-style-position: outside),
the marker must still be outside of the principal block box for the LI
element.

I will use the following code as a sample (with the usual CSS
definitions for UL and LI, i.e., those from
http://www.w3.org/TR/REC-CSS2/sample.html ):


<P>
 Text.<IMG STYLE="float: left; margin: 2em;" SRC="...">
</P>
<UL>
 <LI>Bullet one.</LI>
 <LI>Bullet two.</LI>
 <LI>Bullet three.</LI>
 <LI>Bullet four.</LI>
 <LI>Bullet five.</LI>
 <LI>Bullet six.</LI>
 <LI>Bullet seven.</LI>
</UL>
<P>
 More text.
</P>


This would render as (using * for a list bullet and drawing the margin
edge of the image so you can see where it is.  Note that the content
edge of the UL is aligned with the beginning of the LI text and thus the
bullets are outside of the LI boxes):


-------------- Text.
|   margin   |
|*---------- | Bullet one.
|*| IMAGE  | | Bullet two.
|*|        | | Bullet three.
|*---------- | Bullet four.
|*           | Bullet five.
-*------------ Bullet six.
 * Bullet seven.
 * Bullet eight.

More Text.


I think this is a bad solution.  Perhaps elements with display:
list-item be treated differently from elements with display: block
around floats?  This would, I think, be a good simple solution,
although more control over flow around floats would be better (although
difficult to implement).

The rules as written now are unlikely to be implemented by any browser
makers, especially those who are writing a CSS-based rendering engine
(such as NGLayout) that basically converts presentational HTML into
CSS, since this algorithm is unacceptable for existing content.

David Baron

--------------------------------------------------------------------
L. David Baron         | Freshman, Harvard
dbaron@fas.harvard.edu | < http://www.fas.harvard.edu/~dbaron/ >
--------------------------------------------------------------------

Received on Saturday, 12 December 1998 13:08:19 UTC