Marker box and float interaction errors

<blockquote cite="http://www.w3.org/TR/REC-CSS2/generate.html#markers">
If a marker flows to the right of a float in a left-to-right formatting
context, the principal box will flow down the float's right side, but the
marker boxes will appear to the left of the float. Since the principal box
left border edge lies to the left of the float (see the description of
floats), 
</blockquote>
No.

The left border edge lies to the left of the float only if the principal
box has a negative margin. The left border edge lies to the left of the
right border edge of the float far more often - always unless the
margin-left of the principal box is greater than the total width of the
float.

<blockquote>
and marker boxes lie outside the border edge of the principal box, the
marker will also lie to the left of the float. 
</blockquote>
Not necessarily - see above.
<blockquote>
Analogous behavior applies for right-to-left formatting when a marker
flows to the left of a float.
</blockquote>

This paragraph fails to address all the issues. For example, although
FLOAT {float: left;
border: solid thin;
width: 50%}
ELEMENT:before {display: marker;
content: "1."}
is pretty obvious, the content of the ELEMENT appearing to the left of the
float since the border edge of the float and that of the non-floated
element are one and the same. Thus:

   ----------------------
1. |This is the float.  |This is the non-float,
   ----------------------
   wrapping around the float.

is obvious, but this example is rather more interesting:
FLOAT {float: left;
border: solid thin;
width: 50%}
ELEMENT {margin-left: 3em}
ELEMENT:before {display: marker;
marker-offset: 1em;
content: "1."}

Now this puts the left border edge of the non-floated element about here:
   LBE   
   |  
----------------------
|This is the float.  |This is the non-float,
----------------------
wrapping around the float.


Now if we honour our marker-offset, that places the right of the marker
about here:

  RME    
  |  
----------------------
|This is the float.  |This is the non-float,
----------------------
wrapping around the float.

, and as a result the rendering would be to have the '1.' on top of the
'T'.

This is clearly incorrect because we are used to inline content being
pushed to one side, which must be the correct thing to do here.

So without any help from the erroneous spec, we are forced to make a
decision. Should, for example, we treat the left border edge as the left
of the float, if necessary:
   Border for alignment purposes
   |  Rendered border
   |  |
RM BA BR
 | |  |
 | ----------------------
1. |This is the float.  |This is the non-float,
   ----------------------
 | |
 ---
 1 em
or simply increase the marker offset just enough to be displaced to the
left of the float. For example:
  
      Rendered border
      |
 RM   BR
  |   |
  |----------------------
 1.|This is the float.  |This is the non-float,
   ----------------------

I am very strongly inclined to think that the last is the better option -
just as the normal content is displaced to the side of the float (as with
'This is ...'), so too the marker.

It is also possible to argue however that the marker should overlap with
the float - just as markers will overlap (and be made invisible) given
BODY, OL, LI, HTML {margin: 0}, so too, it is arguable, they should be
with floats.

Anyway, here's my preferred option:
<proposal>
Since markers are placed with respect to the left and right border edge of
their principal box, it is possible for them to overlap with a previous
floated element. If this occurs, the marker should have their
marker-offset increased enough to put them on the other side of the float.

For example:
FLOAT {float: left;
border: solid thin;
width: 50%}
ELEMENT {margin-left: 2em}
ELEMENT:before {display: marker;
marker-offset: 1em;
content: "1."}

<float>
This is the floated element.
</float>
<element>
This is the non-floated element.
</element>
In this example, the left border edge is 2 ems to the right of the left of
the float. Since markers are placed to the left of the bordere edge of the
element with which they are associated, this would normally result in the
right of the marker being placed 1em to the left of this. Due to the float
however, the marker-offset would be increased just enough to align the
right of the marker with the left [margin or border - which?] of the
float.
</proposal>


=====
----------------------------------------------------------
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!?
Talk to your friends online with Yahoo! Messenger.
http://im.yahoo.com

Received on Monday, 7 February 2000 04:09:20 UTC