[CSS21] Another ambiguity in the definition of "containing block"

Consider the following testcase:

<!DOCTYPE html>
<body>
   <div style="height: 200px;">
     Text
     <div style="float: left; height: 50%; width: 100px;
                 background: green"></div>
     More text
     <div>x</div>
     Text
     <div style="float: left; height: 50%; width: 100px;
                 background: orange"></div>
     More text
   </div>
</body>

In current browsers I see the following behavior:

Gecko: Two floating 100px by 100px squares (one green, one orange).
Opera 10: As Gecko.
IE8: As Gecko.

Webkit: No visible squares; the offsetHeight of the floating divs is 
reported as 0.

If the "<div>x</div>" is removed, then Webkit's rendering changes to 
match the other browsers.

I believe the issue is a disagreement over section 10.1 item 2.  Webkit 
is using the anonymous block box created per section 9.2.1.1 to contain 
the text as the containing block for the float.  If one assumes that the 
float and the text around it have the same ancestor boxes (which seems 
like an eminently reasonable assumption), then this interpretation makes 
sense.  If this item is not actually talking about boxes but rather 
means "the box generated by the nearest block-level ancestor element", 
then it's just ambiguous as to which box is meant here.

I still think that all of 10.1 is ambiguous in any but the most trivial 
cases that fall under item 2; this is just another example....

-Boris

Received on Sunday, 27 September 2009 20:25:22 UTC