Re: Issue 101 Resolution

Anton Prowse wrote:
> On 08/10/2010 21:26, Anton Prowse wrote:
>> On 06/10/2010 21:36, Bert Bos wrote:
>>> On Wednesday 06 October 2010 01:48:17 Tab Atkins Jr. wrote:
>>>> This email is an attempt to resolve Issue 101
>>>> (http://wiki.csswg.org/spec/css2.1#issue-101)
>>>
>>>> Suggested Change
>>>> ================
>>>
>>> Why do you propose to change the spec? It's just an implementation bug,
>>> isn't it?
>>
>> Well, the behaviour doesn't match the spec, sure.
>>
>> However, I remain unconvinced that browsers' current behaviour is
>> undesirable. To me, it seems rather logical. As I've mentioned a couple
>> of times already, the issue here is containing blocks and overflow:


I agree but for different reasons. I see it as a set of rules that are 
one sided (the nature of floats), either left or right.


>> Firstly, browsers treat all floats as if their overflow from their
>> containing block is clipped (ie ignored for layout purposes). This is
>> enough to "explain" the test cases for Rule 3, and some of the test
>> cases for Rule 7.


The horizontal overflow of a float from it's containing block is not 
clipped. That can only happen if the containing block has overflow: 
hidden. Is the overflow of this float ignored?


<!DOCTYPE html>
<div style="width:300px;border:5px solid blue;">
  <div style="float: left; width:400px; height:150px; background: 
lime;"></div>
</div>
<div style="background: orange;">This text flows around the float</div>


The reason that rule 3 is being ignored in some cases and in some 
browsers is due to rule 1. I believe that rule 3 was intended to deal 
with simple cases where both floats (left and right) interacted in the 
same containing block. Do you understand the intent of this test 
series [1]?

Sometime in early 2008 I noticed that Gecko would allow the left outer 
edges (with or without margin-left) of right floated boxes to overflow 
the body to the left and become hidden. This caused me to ask this 
question on this list in which dbaron replied [2] (the first part). 
WebKit then changed it bug behavior and then IE8 final followed. It 
was only last year that I realized that is was about rule 1 being 
ignored by all other browsers apart from Gecko.



>> This behaviour is reasonable because overflow is impotent in all other
>> ways in CSS21, so it's anomalous that it isn't impotent for floats.


In which way are you talking about overflow. I do not understand what 
you mean by impotent (definition: utterly unable to do something or 
obsolete, without restraint).



> I'm excepting /vertical/ overflow for floats here, obviously.  The 
> non-impotence of vertical overflow of floats is a unique, integral and 
> justifiable part of float behaviour; it's also rather different from 
> horizontal overflow of floats and from any overflow of other boxes in 
> that these types of overflow are generally "accidental" (which is why 
> impotence is desirable) whereas vertical overflow of floats is "expected".


As above with your use of non-impotence. I see not much difference 
between horizontal overflow and horizontal overflow. The only 
difference is due to the direction of block progression. Overflow in 
ttb block progression typically overflows downwards.



> To make a case for non-impotence of horizontal overflow for floats, you 
> would need to present typographical justification for why the second 
> float should move downwards in this case...
> 
> <!DOCTYPE html>
> <div style="float:left; width:100px; height:100px; 
> background:yellow"></div>
> <div style="margin-left:120px; width:150px; height:200px; 
> background:green">
>     <div style="float:left">supercalifragilisticexpialidocious</div>
> </div>


Should that not be this?

<!DOCTYPE html>
<div style="float:left; width:100px; height:100px; 
background:yellow"></div>
<div style="margin-left:120px; width:150px; height:200px; 
background:green">
     <div style="float:right">supercalifragilisticexpialidocious</div>
</div>


> ...whilst the text doesn't move downwards in this one:
> 
> <!DOCTYPE html>
> <div style="float:left; width:100px; height:100px; 
> background:yellow"></div>
> <div style="margin-left:120px; width:150px; height:200px; 
> background:green">
>     supercalifragilisticexpialidocious
> </div>


How could the text move downwards. The block with the text has it's 
margin-left sitting on the left edge of it's initial containing block, 
one which it shared with the float.


> Cheers,
> Anton Prowse
> http://dev.moonhenge.net


Anton, what do you think should happen here (view in Gecko).


<http://css-class.com/test/temp/rule1and3-rtl.htm>


Should the reverse happen in ltr (overlapping floats)?



1. 
<http://css-class.com/test/css/bidi/visible-overflow-containing-block-ltr.htm>
2. <http://lists.w3.org/Archives/Public/www-style/2008Mar/0423.html>




-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo

Received on Saturday, 9 October 2010 13:10:15 UTC