W3C home > Mailing lists > Public > www-style@w3.org > June 2011

Re: [css3-flexbox] getting multiline flexbox back into the spec

From: fantasai <fantasai.lists@inkedblade.net>
Date: Mon, 06 Jun 2011 11:32:25 +0900
Message-ID: <4DEC3C39.1040402@inkedblade.net>
To: www-style@w3.org
On 06/04/2011 01:40 PM, Alex Mogilevsky wrote:
> ± From: Tab Atkins Jr. [mailto:jackalmage@gmail.com]
> ± Sent: Friday, June 03, 2011 2:01 PM
> ±
> ± flex-direction: lr | rl | tb | bt | lr-tb | lr-bt | rl-tb | rl-bt | tb-lr
> ± | tb-rl | bt-lr | bt-rl |<the inline variants of these>
> ±
> ± The single-direction values imply single-line, while the two-direction
> ± values imply multiline.  Presumably the inline variants would be "ba | ab
> ± | se | es | ..."?
>
> Let me try listing the options:
>
> Option 1: writing-mode-like codes for all physical and logical directions
>
> 	flex-direction:
> 		lr | rl | tb | bt |
> 		lr-tb | lr-bt | rl-tb | rl-bt | tb-lr | tb-rl | bt-lr | bt-rl |
> 		se | es | ba | ab |
> 		se-ba | se-ab | es-ba | es-ab | ba-se | ba-es | ab-se | ab-es
> 	(initial:se)
>
> Option 2: verbose version
>
> 	flex-direction:
> 		horizontal | horizontal-reverse | vertical | vertical-reverse |
> 		horizontal-vertical | horizontal-vertical-reverse |
> 		horizontal-reverse-vertical | horizontal-reverse-vertical-reverse |
> 		vertical-horizontal | vertical-horizontal-reverse |
> 		vertical-reverse-horizontal | vertical-reverse-horizontal-reverse |
> 		inline | inline-reverse | block | block-reverse |
> 		inline-block | inline-block-reverse |
> 		inline-reverse-block | inline-reverse-block-reverse |
> 		block-inline | block-inline-reverse |
> 		block-reverse-inline | block-reverse-inline-reverse
> 	(initial:inline)
>
> Option 3: multiline settings separate
>
> 	flex-direction: lr | rl | tb | bt | inline | inline-reverse | block | block-reverse
> 	(initial:inline)
>
> 	flex-lines: single | multiple
> 	(initial:single)
>
> 	flex-lines-direction: normal | reverse
> 	(initial:normal)
>
> Option 4: multiline settings separate, combined
>
> 	flex-direction: lr | rl | tb | bt | inline | inline-reverse | block | block-reverse
> 	(initial:inline)
>
> 	flex-lines: single | multiple | multiple-reverse
> 	(initial:single)
>
> Option 5: separate direction and orientation (as in 2007 spec)
>
> 	flex-orientation: horizontal | vertical | inline | block
> 	(initial:inline)
>
> 	flex-direction: normal | reverse
> 	(initial:inline)
>
> 	flex-lines: single | multiple
> 	(initial:single) 	
>
> 	flex-lines-progression: normal | reverse
> 	(initial:normal)
>
> To be honest I still prefer the 2007-style separate properties (option 5).
> It has the most useful default (authors will very rarely use anything other
> than 'flex-orientation', and when they do it is clear what's changing).

Option 6:

   flex-orientation: rows | columns | horizontal | vertical

   flex-wrap: no-wrap | wrap | balance*

   flex-direction: [ forward | backward ] || reverse-stack

* taken from howcome's balance-lines suggestion, to show how it would be added
   if we decide to add it for flexbox

~fantasai
Received on Monday, 6 June 2011 05:08:54 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:41 GMT