Re: [css3-gcpm] containing block for top/bottom floats

Håkon Wium Lie <howcome@opera.com> wrote on 2009/01/05 18:56:28
> 
> Also sprach MURAKAMI Shinyu:
> 
>  > > However, I agree that GCPM should state that floats float within the
>  > > column box unless "page" or "multi-column" is specified.
> 
>  > Some questions:
>  > 
>  > If column box does not exist, i.e., no multi-column elements, is 
>  > 'float: top' equivalent to 'float: top page'?
>  > 
>  > Table-cells, inline-blocks, floats, and absolute/fixed positioned boxes
>  > do not act as containing block for the purpose of 'float: top'?
>  > 
>  > Example:
>  > <table>
>  >   <tr>
>  >     <td>table-cell
>  >        <div style="float:top">top-float in table-cell</div>
>  >     </td>
>  >   </tr>
>  > </table>
>  > 
>  > Is this top-float floated to the top of the page, or to the top of the
>  > table-cell?
> 
> In my mind: top of the table cell. To make the div escape its
> containing block, the "page" or "multi-column" keyword is required.
> 
> Is this compatible with your thinking (After all, you proposed the
> "multi-column" keyword :-)

Yes, that's compatible with my thinking and current our implementation.
But the description in the GCPM editor's draft seems still insufficient.

    top
      This keyword indicates that the element is floated to the top of
      the containing block. Unless 'top' is combined with 'page' or
      'multi-column', the column box will act as containing block for
      the purpose of 'float'. 

The "column box" here should be extended to something not only column
box but also table cell, other float, absolute positioned box, etc.
So I wrote:
| My proposal:
| When the float property value has a vertical keyword (top, bottom) and
| has no reference keyword (page, multi-column), the containing block is
| formed by the content edge of the nearest box that is a column box or 
| is a "flow root" defined in the CSS3 basic box model [3] or page area.
| In vertical text, a horizontal keyword is vice versa.
| 
| [3] http://www.w3.org/TR/css3-box/#flow-root
| | A flow root is a box that satisfies at least one of the following:
| | - The value of 'float' is not 'none'.
| | - The used value of 'overflow' is not 'visible'.
| | - The value of 'display' is 'table-cell', 'table-caption',
| |   'inline-block' or 'inline-table'.
| | - The value of 'position' is neither 'static' nor 'relative'.
| | - The value of 'block-progression' is 'lr' or 'rl' and the value of
| |   'block-progression' of its parent box is 'tb'
| | - The value of 'block-progression' is 'tb' and the value of
| |   'block-progression' of its parent box is 'lr' or 'rl'. 
| | Other modules may define additional flow roots. 

-- 
Shinyu Murakami
http://www.antennahouse.com
Antenna House Formatter
http://www.antenna.co.jp/AHF/en/

Received on Monday, 5 January 2009 12:44:37 UTC