- From: Andrew Fedoniouk <andrew.fedoniouk@live.com>
- Date: Tue, 7 Jun 2011 21:06:51 -0700
- To: <www-style@w3.org>, "Eric A. Meyer" <eric@meyerweb.com>
-----Original Message-----
>From: Eric A. Meyer
>Sent: Tuesday, June 07, 2011 6:04 AM
>To: www-style@w3.org
>Subject: Re: [css3-flexbox] getting multiline flexbox back into the spec
>
> I would find it deeply odd to have to use a writing-direction
>property to define layout order. That would be like having to use
>'text-align' to center element boxes.
>
Agree in general on this but I think we are missing some point in
the discussion.
First of all I have to say that for three or so years using flexes,
in particular flow:horizontal, I did not get any requests to provide
anything close to box-direction.
flow:horizontal follows directionality of UI and it is perfectly enough
so far.
If you need non-default order of elements then it usually
happens when a) you have known number of children and b) most
probably you will also need to replace elements in non-consecutive
order. In this case you can use explicit, templated definition:
block-flow: 4-3-2-1; // or
block-flow: 1-3-2-4; // or even
block-flow: 1-2-2-3
1-4-5-5;
I would insist that "template" is a natural part of flex module. It
simplifies layout definitions a lot.
OK, back to flow:horizontal and flow:horizontal-wrap...
These layouts are used when:
1) Number of children is not known upfront and/or
2) the number can change dynamically.
Examples: headers/toolbars, footers/statusbars, panels with splitters
between them, etc.
Having visual flow to run in opposite direction from DOM order is
a source of permanent problems (who implemented LTR/RTL text editing
will understand me here).
If we really want to provide explicit definition of order of blocks
then it can be done as:
block-flow: horizontal; /* uses default directionality, @dir->direction */
block-flow: horizontal-ltr; /* left-to-right */
block-flow: horizontal-rtl; /* right-to-left */
block-flow: vertical; /* uses default directionality: ttb */
block-flow: vertical-ttb; /* top-to-bottom */
block-flow: vertical-btt; /* bottom-to-top */
Explicit declaration as 'horizontal-ltr' is significantly
more reliable than anything like 'direction:horizontal reverse'
By the way, you used keyword 'reverse'. It is 'reverse' to what actually?
I mean what exactly defines normal, non-reversed order then,
the 'direction'?
--
Andrew Fedoniouk
http://terrainformatica.com
Received on Wednesday, 8 June 2011 04:07:29 UTC