W3C home > Mailing lists > Public > public-css-testsuite@w3.org > December 2010

Re: block-in-inline-relpos-002 invalid (and was Issue 138 resolution sufficient?)

From: Alan Gresley <alan@css-class.com>
Date: Thu, 23 Dec 2010 23:30:11 +1100
Message-ID: <4D1340D3.3030801@css-class.com>
To: "L. David Baron" <dbaron@dbaron.org>
CC: public-css-testsuite@w3.org, www-style@w3.org
On 23/12/2010 4:56 PM, Alan Gresley wrote:
[snip]
> I side note, I don't understand why the border boxes of the parent
> <span> in some test are offset 200px left from the float's right edge.
> This seems bazaar. IE8 mode in IE9 beta and IE9 beta seem more
> consistent in all test.

Issue 138:  Does relatively positioning a float's parent also offset the 
float?

Before considering this, is the parent's position actually offset by the 
width of the float to begin with? If so, how then can the float be the 
offset along with the parent. The would cause both the float and it's 
parent's position to be codependent on the afters position. Like some loop.

The behavior that I see implemented is where the parent's position is 
actually offset by the width of the float to begin with.

<http://css-class.com/test/temp/block-in-inline-relpos.htm>

Example (b) and (c) render the same in the examples with floated 
children but the markup is different.

<div>
   <span style="position:relative; left: 200px;" class="box">
     <span style="float: left; width: 150px; background: yellow;">(b) 
Float</span>(b)
   </span>
</div>

<div>
     <span style="float: left; width: 150px; background: yellow;">(c) 
Float</span>
     <span style="position:relative; left: 200px;" class="box">(c)</span>
</div>

It appears that the relatively position inline parent is offset from 
it's static position. In affect the relatively position inline parent is 
flowing around it's floated child. Since this is so, how then can the 
float possibly ever be offset according to the offset of it's inline parent?

At the bottom is this the following example that shows that there is 
some generated box that flows around the float and the offset is from 
the left edge of this generated box.

<div>
    B<span style="position:relative; left: 200px;" class="box">
     <span style="float: left; width: 150px; background: yellow;">(b) 
Float</span>(b)
   </span>A
</div>

FF 3.6.13, Safari 5 and Opera 11 renders as this.

(b) Float                 |B     A                                 | (b)|
                                    <-------- offset -------->

IE8 mode (IE9) and IE9b renders poorly.

                                B     (b) Float                 |    | (b)|
                                    <-------- offset -------->

IE7 renders like the question in CSS2.1 issue 138

B     A                                 | (b)|
   <-------- offset -------->
                                          (b) Float                 |
<-------- offset -------->



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

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
Received on Thursday, 23 December 2010 12:30:47 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Thursday, 23 December 2010 12:30:55 GMT