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

Re: [css3-flexbox] multiline

From: Andrew Fedoniouk <andrew.fedoniouk@live.com>
Date: Fri, 15 Apr 2011 20:15:57 -0700
Message-ID: <BLU159-ds178F87A5D363C436CBBDFFF8AF0@phx.gbl>
To: "Alex Mogilevsky" <alexmog@microsoft.com>, "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: "www-style list" <www-style@w3.org>
>
>-----Original Message----- 
>From: Alex Mogilevsky
>Sent: Thursday, April 14, 2011 11:10 PM
>To: Andrew Fedoniouk ; Tab Atkins Jr.
>Cc: www-style list
>Subject: RE: [css3-flexbox] multiline
>
>
>Multiline flexbox was not proposed by IE, we just were first to try it...
>We don't really know what kind of use cases will require row breaks. Will 
>be
>easier to decide when we see some use examples.

Consider this:
<div>
  <h1>Header1</h1>
  <p>first</p> <p>second</p>
</div>
<div>
  <h1>Header2</h1>
  <p>first</p> <p>second</p>
  <p>third</p>
</div>

The desire is to see <p>'s in rows by two and of the same width and height.
This is made by using these styles:

div { flow:horizontal-flow; }
div h1 { clear:both; width:1*; }
div p { size:1*; border:1px solid; }
div p:nth-child(2n) { clear:after; }

Here is the rendering:
http://terrainformatica.com/w3/horizontal-flow-clear.png

>
>> I suggest to use 'clear' for that.  'clear' breaks float rows and so it
>> can be used for exactly the same purposes in flexboxes (that cannot
>> contain floats directly anyway).
>
>Interesting idea. It is best to avoid reusing properties unless there is an
>exact match. 'clear' has multiple values without obvious mapping to
>flexbox... In this case a new property would work better.
>

flow:horizontal-flow; in my interpretation define directionality
of the flow up to sign precision.
flow:horizontal-flow honors direction:ltr|rtl; in the same way as
tables do.

So all values of 'clear' are used as they are. Simply because

  section { flow:horizontal-flow; } is a [better] variant of

  section > * { float:left|right; }

The only conceptual difference is a use of flexes (against row boxes in my
case)

-- 
Andrew Fedoniouk

http://terrainformatica.com
Received on Saturday, 16 April 2011 03:16:28 GMT

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