- From: Anton Prowse <prowse@moonhenge.net>
- Date: Thu, 21 Oct 2010 19:45:29 +0200
- To: www-style list <www-style@w3.org>
- CC: Alan Gresley <alan@css-class.com>, "Tab Atkins Jr." <jackalmage@gmail.com>, Peter Moulder <peter.moulder@monash.edu>
On 21/10/2010 08:06, Alan Gresley wrote: > Tab Atkins Jr. wrote: >> On Wed, Oct 20, 2010 at 11:05 AM, Anton Prowse wrote: >>> On 20/10/2010 18:05, Tab Atkins Jr. wrote: > I do see this in the > spec 10.1 (Definition of "containing block" ) point 2. > > | For other elements, if the element's position is 'relative' > | or 'static', the containing block is formed by the content > | edge of the nearest block-level, table cell or inline-block > | ancestor box. > > So in dbaron's test for rule 3, the containing block of the left floated > box is the aqua box and the containing block of the aqua box is the > yellow box. So the change now reflects the concept of nearest > block-level ancestor. I have no idea what you're getting at here. >>>> Suggested text: >>>> | A left-floating box that has another left-floating >>>> | box to its left, where the latter box's right edge >>>> | is to the right of the original left-floating box's >>>> | containing block's left edge, may not have its right outer >>>> | edge to the right of its containing block's right >>>> | edge. (Loosely: a left float may not stick out at >>>> | the right edge, unless it is already as far to the >>>> | left as possible.) An analogous rule holds for >>>> | right-floating elements. >>> s/original left-floating/former/ >> >> Good catch; that makes the text cleaner. >> >> New rule 3 text (I overcorrected for "outer edge"): >> | The right outer edge of a left-floating box may not >> | be to the right of the left outer edge of any >> | right-floating box that is to the right of it and >> | whose left outer edge is to the left of the >> | left-floating box's containing block's right edge. >> | Analogous rules hold for right-floating elements. >> >> New rule 7 text (slightly cleaner): >> | A left-floating box that has another left-floating >> | box to its left, where the latter box's right edge >> | is to the right of the former box's containing >> | block's left edge, may not have its right outer >> | edge to the right of its containing block's right >> | edge. (Loosely: a left float may not stick out at >> | the right edge, unless it is already as far to the >> | left as possible.) An analogous rule holds for >> | right-floating elements. >> > > Can the above parts that have "containing block's right edge" be changed > to "containing block's right content edge". > > s/containing block's right edge/containing block's right content edge/ No, no. The containing block doesn't have a "content edge"; it's a rectangular region. > <!DOCTYPE html> > <div style="float: right; width: 400px; height: 100px; background: > green;">Right</div> > <div style="float: left; width: 80px; height: 80px; margin-right:-100px; > border: 10px solid blue;">Left</div> > > Narrowing the viewport, Gecko and IE8 will allow the right floating box > (green) to pass under the left floating box (blue border) and go into > the hidden overflow. Opera, WebKit and IE9 shows the left floating box > (blue border) dropping when the left outer edge of the right floating > box passes the left content edge of the 'initial containing block'. The dropping is correct, right? This is simply Rule 3 in its traditional form (and of course in its newly proposed form too, since it's backwards compatible). The containing block is only tangentially relevant. > I believe that Gecko and IE8 behavior is correct since the left floating > box (blue) right outer edge (margin edge) sit on the same vertical axis > as it's left outer edge. This means the float takes > up no horizontal space in it's containing block as the below test shows. Whether it has zero- or negative-width margin area is irrelevant. The only thing that matters is the location of its right outer edge. (See also the related discussion in [1,2] where we're dealing with line boxes rather than right floats.) [1] http://lists.w3.org/Archives/Public/www-style/2010Aug/0182.html [2] http://lists.w3.org/Archives/Public/www-style/2010Sep/0129.html Cheers, Anton Prowse http://dev.moonhenge.net
Received on Thursday, 21 October 2010 17:46:44 UTC