CSS3: Multi-columns property proposal: column-count-policy

This is a bit long -- and my first such proposal -- but it's an effort
to help Robert O'Callaghan implement in Mozilla the ideas he raised in
his "column-balance" proposal. This is a slightly different method, that
also creates a new property, "column-count-policy" which follows the
syntax of "column-width-policy".

'column-count-policy'
Value: flexible | strict | inherit
Initial: flexible
Applies to: block-level elements
Inherited: no
Percentage values: N/A
This property describes how to interpret 'column-count'. The values are 

flexible - indicates that the number of columns can extend beyond the
element's width until the end of the content is reached. 
strict - indicates that 'column-count' is to be honored. If
'column-count' is 'auto', the element's height increase until the end of
the content is reached. If, based on the specified value of the column
properties, the CWRG is larger than the content width of the element,
the actual value of 'column-count' must be reduced to make the columns
fit inside the content area. 

Adding this would mean altering "CSS3 module: Multi-column layout 6.1.
Reducing the number of columns" 
<http://www.w3.org/TR/2001/WD-css3-multicol-20010118/#reducing>

Here are some usage scenarios, I think I've caught most of the variants:

1) UA creates as many columns as there is room for.
2) UA creates as many columns as specified.
3) The box height adjusts.
4) The columns continue to be generated outside the element's width.
5) The box width scrolls.
6) The box height scrolls.
7) Excess content is hidden.

*Auto columns*

column-count: auto
height & max-height: auto
Behaviour: 1,3

*Auto columns with height*

column-count: auto
height|max-height: <not auto>
overflow: visible
1,4

column-count: auto
height|max-height: <not auto>
overflow: hidden
1,4,7

column-count: auto
height|max-height: <not auto>
overflow: scroll|auto
1,4,5

*Auto columns with height and strict count policy*

column-count: auto
column-count-policy: strict 
height|max-height: <not auto>
overflow: visible
1,3

column-count: auto
column-count-policy: strict 
height|max-height: <not auto>
overflow: hidden
1,3,7

column-count: auto
column-count-policy: strict 
height|max-height: <not auto>
overflow: scroll|auto
1,3,6

*Fixed columns*

column-count: <not auto>
height: auto
2,3

*Fixed columns with height*

column-count: <not auto>
height: <not auto>
2,3

column-count: <not auto>
height: <not auto>
overflow: hidden
2,3,7

column-count: <not auto>
height: <not auto>
overflow: scroll|auto
2,3,6

*Fixed column width with max-height*

column-count: <not auto>
max-height: <not auto>
2,4

column-count: <not auto>
max-height: <not auto>
overflow: hidden
2,4,7

column-count: <not auto>
max-height: <not auto>
overflow: scroll|auto
2,4,5

*Fixed column width with max-height and strict count policy*

column-count: <not auto>
column-count-policy: strict 
max-height: <not auto>
2,3

column-count: <not auto>
column-count-policy: strict 
max-height: <not auto>
overflow: hidden
2,3,7

column-count: <not auto>
column-count-policy: strict 
max-height: <not auto>
overflow: scroll|auto
2,3,6


-- 
Cheers,

Craig Saila
------------------------------------------
craig@saila.com : http://www.saila.com/
------------------------------------------

Received on Wednesday, 14 July 2004 12:58:05 UTC