- From: Tab Atkins Jr.. via cvs-syncmail <cvsmail@w3.org>
- Date: Sat, 20 Aug 2011 00:16:19 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-flexbox
In directory hutz:/tmp/cvs-serv23355
Modified Files:
Overview.html Overview.src.html
Log Message:
Rearranged and rewrote the flex-flow chapter.
It currently references a lot of terms I haven't defined yet.
Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css3-flexbox/Overview.html,v
retrieving revision 1.33
retrieving revision 1.34
diff -u -d -r1.33 -r1.34
--- Overview.html 19 Aug 2011 18:17:14 -0000 1.33
+++ Overview.html 20 Aug 2011 00:16:17 -0000 1.34
@@ -16,12 +16,12 @@
<h1 id=head-box-flexible>CSS Flexible Box Layout Module</h1>
- <h2 class="no-num no-toc" id=w3c-working>Editor's Draft, 19 August 2011</h2>
+ <h2 class="no-num no-toc" id=w3c-working>Editor's Draft, 20 August 2011</h2>
<dl>
<dt>This version:
- <dd><!-- <a href="http://www.w3.org/TR/2011/WD-css3-flexbox-20110819/">http://www.w3.org/TR/2011/WD-css3-flexbox-20110819/</a></dd> -->
+ <dd><!-- <a href="http://www.w3.org/TR/2011/WD-css3-flexbox-20110820/">http://www.w3.org/TR/2011/WD-css3-flexbox-20110820/</a></dd> -->
<a
href="http://dev.w3.org/csswg/css3-flexbox/">http://dev.w3.org/csswg/css3-flexbox/</a>
@@ -475,119 +475,166 @@
<p>The ‘<code class=property>flexbox-flow</code>’ property
specifies how <a href="#flexbox-item"><i>flexbox item</i></a>s are placed
- in the flexbox. The value of the property can consist of one or two
- keywords describing direction of main axis and direction of wrapping. The
- keywords have the following meanings:
+ in the flexbox. The value consists of one or two keywords: the first sets
+ the orientation and direction of the flexbox's <a
+ href="#main-axis"><i>main axis</i></a>, while the second, if specified,
+ marks the flexbox as being multiline and sets the direction in which new
+ lines are stacked.
+
+ <p>The main directions affect how <i>flexbox items</i> are arranged, and
+ how they respond to the ‘<a href="#flex-pack0"><code
+ class=property>flex-pack</code></a>’ property. They can be set with
+ either logical directions (relative to the writing mode) or physical
+ directions:
<dl>
- <dt><dfn id=flex-flow-horizontal>horizontal</dfn>
+ <dt>Logical Directions
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- horizontally. In horizontal writing modes, items are added in inline
- direction of current writing mode. In vertical writing modes, items are
- added in block direction of current writing mode.
+ <dd>
+ <dl>
+ <dt><dfn id=flex-flow-row>row</dfn>
- <dt><dfn id=flex-flow-horizontal-reverse>horizontal-reverse</dfn>
+ <dd>The flexbox's <a href="#main-axis"><i>main axis</i></a> has the same
+ orientation as the inline axis of the current writing mode (the
+ direction that text is laid out in). The <i>main-start</i> and
+ <i>main-end</i> directions are equivalent to the "start" and "end"
+ directions, respectively, of the current writing mode.
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- horizontally. Items are added in direction opposite to the direction
- defined by ‘<a href="#flex-flow-horizontal"><code
- class=property>horizontal</code></a>’ value.
+ <dt><dfn id=flex-flow-row-reverse>row-reverse</dfn>
- <dt><dfn id=flex-flow-horizontal-ltr>horizontal-ltr</dfn>
+ <dd>Same as <a href="#flex-flow-row"><i>row</i></a>, except the
+ <i>main-start</i> and <i>main-end</i> directions are swapped.
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- horizontally, from left to right.
+ <dt><dfn id=flex-flow-column>column</dfn>
- <dt><dfn id=flex-flow-horizontal-rtl>horizontal-rtl</dfn>
+ <dd>The flexbox's <a href="#main-axis"><i>main axis</i></a> has the same
+ orientation as the block axis of the current writing mode (the
+ direction that blocks are laid out in). The <i>main-start</i> and
+ <i>main-end</i> directions are equivalent to the "before" and "after"
+ directions, respectively, of the current writing mode.
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- horizontally, from right to left.
+ <dt><dfn id=flex-flow-column-reverse>column-reverse</dfn>
- <dt><dfn id=flex-flow-vertical>vertical</dfn>
+ <dd>Same as <a href="#flex-flow-column"><i>column</i></a>, except the
+ <i>main-start</i> and <i>main-end</i> directions are swapped.
+ </dl>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- vertically. In vertical writing modes, items are added in inline
- direction of current writing mode. In horizontal writing modes, items are
- added in block direction of current writing mode.
+ <dt>Physical Directions
- <dt><dfn id=flex-flow-vertical-reverse>vertical-reverse</dfn>
+ <dd>
+ <dl>
+ <dt><dfn id=flex-flow-horizontal>horizontal</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- vertically. Items are added in direction opposite to the direction
- defined by ‘<a href="#flex-flow-vertical"><code
- class=property>vertical</code></a>’ value.
+ <dd>The flexbox's <a href="#main-axis"><i>main axis</i></a> is
+ horizontal. The <i>main-start</i> direction is equivalent to either the
+ "start" or "before" direction of the current writing mode, whichever is
+ vertical, and the <i>main-end</i> direction is the opposite direction
+ of <i>main-start</i>.
- <dt><dfn id=flex-flow-vertical-ttb>vertical-ttb</dfn>
+ <dt><dfn id=flex-flow-horizontal-reverse>horizontal-reverse</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- vertically, from top to bottom.
+ <dd>Same as <a href="#flex-flow-horizontal"><i>horizontal</i></a>,
+ except the <i>main-start</i> and <i>main-end</i> directions are
+ swapped.
- <dt><dfn id=flex-flow-row-vertical-btt>vertical-btt</dfn>
+ <dt><dfn id=flex-flow-horizontal-ltr>horizontal-ltr</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed
- vertically, from bottom to top.
+ <dd>Same as <a href="#flex-flow-horizontal"><i>horizontal</i></a>,
+ except the <i>main-start</i> direction is to the left and the
+ <i>main-end</i> direction is to the right.
- <dt><dfn id=flex-flow-row>row</dfn>
+ <dt><dfn id=flex-flow-horizontal-rtl>horizontal-rtl</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed in same
- orientation and direction as inline content in current writing mode.
+ <dd>Same as <a href="#flex-flow-horizontal"><i>horizontal</i></a>,
+ except the <i>main-start</i> direction is to the right and the
+ <i>main-end</i> direction is to the left.
- <dt><dfn id=flex-flow-row-reverse>row-reverse</dfn>
+ <dt><dfn id=flex-flow-vertical>vertical</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed in same
- orientation as inline content in current writing mode, but in opposite
- direction.
+ <dd>The flexbox's <a href="#main-axis"><i>main axis</i></a> is vertical.
+ The <i>main-start</i> direction is equivalent to either the "start" or
+ "before" direction of the current writing mode, whichever is
+ horizontal, and the <i>main-end</i> direction is the opposite direction
+ of <i>main-start</i>.
- <dt><dfn id=flex-flow-column>column</dfn>
+ <dt><dfn id=flex-flow-vertical-reverse>vertical-reverse</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed in same
- orientation and direction as block boxes in current writing mode.
+ <dd>Same as <a href="#flex-flow-vertical"><i>vertical</i></a>, except
+ the <i>main-start</i> and <i>main-end</i> directions are swapped.
- <dt><dfn id=flex-flow-column-reverse>columns-reverse</dfn>
+ <dt><dfn id=flex-flow-vertical-ttb>vertical-ttb</dfn>
- <dd><a href="#flexbox-item"><i>Flexbox item</i></a>s are placed in same
- orientation as block boxes in current writing mode, but in opposite
- direction.
+ <dd>Same as <a href="#flex-flow-vertical"><i>vertical</i></a>, except
+ the <i>main-start</i> direction is upwards and the <i>main-end</i>
+ direction is downwards.
+
+ <dt><dfn id=flex-flow-row-vertical-btt>vertical-btt</dfn>
+ <dd>Same as <a href="#flex-flow-vertical"><i>vertical</i></a>, except
+ the <i>main-start</i> direction is downwards and the <i>main-end</i>
+ direction is upwards.
+ </dl>
+ </dl>
+
+ <p>The <a href="#cross-axis"><i>cross axis</i></a> is always perpendicular
+ to the <a href="#main-axis"><i>main axis</i></a>. The second keyword, or
+ the lack of it, sets the cross directions (<i>cross-start</i> and
+ <i>cross-end</i>), and dictates whether the flexbox is single-line or
+ multi-line. The cross directions affect how individual <i>flexbox
+ items</i> respond to the ‘<a href="#flex-align0"><code
+ class=property>flex-align</code></a>’ property, and the direction in
+ which multiple lines are stacked and aligned by the ‘<a
+ href="#propdef-flex-line-pack"><code
+ class=property>flex-line-pack</code></a>’ property.
+
+ <p>If the second keyword is omitted, the flexbox is single-line, the
+ <i>cross-start</i> direction is equivalent to either the "start" or
+ "before" direction of the current writing mode, whichever is in the
+ <i>cross-axis</i>, and the <i>cross-end</i> direction is the opposite
+ direction of <i>cross-start</i>.
+
+ <p>If the second keyword is provided, the flexbox is <a
+ href="#multiline">multi-line</a>. The <i>cross-start</i> and
+ <i>cross-end</i> directions are set as follows:
+
+ <dl>
<dt><dfn id=flex-flow-wrap>wrap</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. In horizontal writing modes, new lines are
- added in block direction. In vertical writing modes, new lines are added
- in inline direction.
+ <dd>The <i>cross-start</i> direction is equivalent to either the "start"
+ or "before" direction of the current writing mode, whichever is in the
+ <i>cross-axis</i>, and the <i>cross-end</i> direction is the opposite
+ direction of <i>cross-start</i>.
<dt><dfn id=flex-flow-wrap-reverse>wrap-reverse</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. New lines are added in direction opposite
- to the direction defined by ‘<a href="#flex-flow-wrap"><code
- class=property>wrap</code></a>’ value.
+ <dd>Same as <a href="#flex-flow-wrap"><i>wrap</i></a>, except the
+ <i>cross-start</i> and <i>cross-end</i> directions are swapped.
<dt><dfn id=flex-flow-wrap-up>wrap-up</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. New lines are added above.
+ <dd>The <i>cross-start</i> direction is downwards and the <i>cross-end</i>
+ direction is upwards.
<dt><dfn id=flex-flow-wrap-right>wrap-right</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. New lines are added to the right.
+ <dd>The <i>cross-start</i> direction is to the left and the
+ <i>cross-end</i> direction is to the right.
<dt><dfn id=flex-flow-wrap-down>wrap-down</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. New lines are added below.
+ <dd>The <i>cross-start</i> direction is upwards and the <i>cross-end</i>
+ direction is downwards.
<dt><dfn id=flex-flow-wrap-left>wrap-left</dfn>
- <dd>Flow of <a href="#flexbox-item"><i>flexbox item</i></a>s is wrapped
- into multiple lines as needed. New lines are added to the left.
+ <dd>The <i>cross-start</i> direction is to the right and the
+ <i>cross-end</i> direction is to the left.
</dl>
- <p>Not all combinaiton of main-axis direction and flow direction are
- allowed, because some combinations don't make sense (for example
- "flex-flow: horizontal wrap-right" is not possible).
+ <p class=note>Note that not all combinations of first and second keyword
+ are allowed by the property's syntax, as they don't all make sense. For
+ example, ‘<code class=css>flex-flow: horizontal
+ wrap-right</code>’ is an invalid declaration.
<div class=example>
<p>Some examples of valid flows:</p>
@@ -603,9 +650,6 @@
flex-flow:vertical wrap-reverse } /* wrap direction is left-to-right (opposite to block direction) */</pre>
</div>
- <p>For details on wrapping into multiple lines, see <a
- href="#multiline">Multi-line flexbox</a>
-
<h2 id=flex-order><span class=secno>5. </span> Display Order: the ‘<a
href="#flex-order0"><code class=property>flex-order</code></a>’
property</h2>
@@ -2207,8 +2251,8 @@
<li>column, <a href="#flex-flow-column"
title=column><strong>4.</strong></a>
- <li>columns-reverse, <a href="#flex-flow-column-reverse"
- title=columns-reverse><strong>4.</strong></a>
+ <li>column-reverse, <a href="#flex-flow-column-reverse"
+ title=column-reverse><strong>4.</strong></a>
<li>cross axis, <a href="#cross-axis" title="cross
axis"><strong>1.</strong></a>
Index: Overview.src.html
===================================================================
RCS file: /sources/public/csswg/css3-flexbox/Overview.src.html,v
retrieving revision 1.32
retrieving revision 1.33
diff -u -d -r1.32 -r1.33
--- Overview.src.html 19 Aug 2011 18:17:14 -0000 1.32
+++ Overview.src.html 20 Aug 2011 00:16:17 -0000 1.33
@@ -219,65 +219,85 @@
</tbody>
</table>
- <p>The 'flexbox-flow' property specifies how <i>flexbox item</i>s are placed in the flexbox. The value of the property can consist of one or two keywords describing direction of main axis and direction of wrapping. The keywords have the following meanings:</p>
-
+ <p>The 'flexbox-flow' property specifies how <i>flexbox item</i>s are placed in the flexbox. The value consists of one or two keywords: the first sets the orientation and direction of the flexbox's <i>main axis</i>, while the second, if specified, marks the flexbox as being multiline and sets the direction in which new lines are stacked.</p>
+
+ <p>The main directions affect how <i>flexbox items</i> are arranged, and how they respond to the 'flex-pack' property. They can be set with either logical directions (relative to the writing mode) or physical directions:</p>
+
<dl>
- <dt><dfn id='flex-flow-horizontal'>horizontal</dfn></dt>
- <dd><i>Flexbox item</i>s are placed horizontally. In horizontal writing modes, items are added in inline direction of current writing mode. In vertical writing modes, items are added in block direction of current writing mode.</dd>
+ <dt>Logical Directions</dt>
+ <dd>
+ <dl>
+ <dt><dfn id='flex-flow-row'>row</dfn></dt>
+ <dd>The flexbox's <i>main axis</i> has the same orientation as the inline axis of the current writing mode (the direction that text is laid out in). The <i>main-start</i> and <i>main-end</i> directions are equivalent to the "start" and "end" directions, respectively, of the current writing mode.</dd>
- <dt><dfn id='flex-flow-horizontal-reverse'>horizontal-reverse</dfn></dt>
- <dd><i>Flexbox item</i>s are placed horizontally. Items are added in direction opposite to the direction defined by 'horizontal' value.</dd>
+ <dt><dfn id='flex-flow-row-reverse'>row-reverse</dfn></dt>
+ <dd>Same as <i>row</i>, except the <i>main-start</i> and <i>main-end</i> directions are swapped.</dd>
- <dt><dfn id='flex-flow-horizontal-ltr'>horizontal-ltr</dfn></dt>
- <dd><i>Flexbox item</i>s are placed horizontally, from left to right.</dd>
+ <dt><dfn id='flex-flow-column'>column</dfn></dt>
+ <dd>The flexbox's <i>main axis</i> has the same orientation as the block axis of the current writing mode (the direction that blocks are laid out in). The <i>main-start</i> and <i>main-end</i> directions are equivalent to the "before" and "after" directions, respectively, of the current writing mode.</dd>
- <dt><dfn id='flex-flow-horizontal-rtl'>horizontal-rtl</dfn></dt>
- <dd><i>Flexbox item</i>s are placed horizontally, from right to left.</dd>
+ <dt><dfn id='flex-flow-column-reverse'>column-reverse</dfn></dt>
+ <dd>Same as <i>column</i>, except the <i>main-start</i> and <i>main-end</i> directions are swapped.</dd>
+ </dl>
+ </dd>
- <dt><dfn id='flex-flow-vertical'>vertical</dfn></dt>
- <dd><i>Flexbox item</i>s are placed vertically. In vertical writing modes, items are added in inline direction of current writing mode. In horizontal writing modes, items are added in block direction of current writing mode.</dd>
+ <dt>Physical Directions</dt>
+ <dd>
+ <dl>
+ <dt><dfn id='flex-flow-horizontal'>horizontal</dfn></dt>
+ <dd>The flexbox's <i>main axis</i> is horizontal. The <i>main-start</i> direction is equivalent to either the "start" or "before" direction of the current writing mode, whichever is vertical, and the <i>main-end</i> direction is the opposite direction of <i>main-start</i>.</dd>
- <dt><dfn id='flex-flow-vertical-reverse'>vertical-reverse</dfn></dt>
- <dd><i>Flexbox item</i>s are placed vertically. Items are added in direction opposite to the direction defined by 'vertical' value.</dd>
+ <dt><dfn id='flex-flow-horizontal-reverse'>horizontal-reverse</dfn></dt>
+ <dd>Same as <i>horizontal</i>, except the <i>main-start</i> and <i>main-end</i> directions are swapped.</dd>
- <dt><dfn id='flex-flow-vertical-ttb'>vertical-ttb</dfn></dt>
- <dd><i>Flexbox item</i>s are placed vertically, from top to bottom.</dd>
+ <dt><dfn id='flex-flow-horizontal-ltr'>horizontal-ltr</dfn></dt>
+ <dd>Same as <i>horizontal</i>, except the <i>main-start</i> direction is to the left and the <i>main-end</i> direction is to the right.</dd>
- <dt><dfn id='flex-flow-row-vertical-btt'>vertical-btt</dfn></dt>
- <dd><i>Flexbox item</i>s are placed vertically, from bottom to top.</dd>
+ <dt><dfn id='flex-flow-horizontal-rtl'>horizontal-rtl</dfn></dt>
+ <dd>Same as <i>horizontal</i>, except the <i>main-start</i> direction is to the right and the <i>main-end</i> direction is to the left.</dd>
- <dt><dfn id='flex-flow-row'>row</dfn></dt>
- <dd><i>Flexbox item</i>s are placed in same orientation and direction as inline content in current writing mode.</dd>
+ <dt><dfn id='flex-flow-vertical'>vertical</dfn></dt>
+ <dd>The flexbox's <i>main axis</i> is vertical. The <i>main-start</i> direction is equivalent to either the "start" or "before" direction of the current writing mode, whichever is horizontal, and the <i>main-end</i> direction is the opposite direction of <i>main-start</i>.</dd>
- <dt><dfn id='flex-flow-row-reverse'>row-reverse</dfn></dt>
- <dd><i>Flexbox item</i>s are placed in same orientation as inline content in current writing mode, but in opposite direction.</dd>
+ <dt><dfn id='flex-flow-vertical-reverse'>vertical-reverse</dfn></dt>
+ <dd>Same as <i>vertical</i>, except the <i>main-start</i> and <i>main-end</i> directions are swapped.</dd>
- <dt><dfn id='flex-flow-column'>column</dfn></dt>
- <dd><i>Flexbox item</i>s are placed in same orientation and direction as block boxes in current writing mode.</dd>
+ <dt><dfn id='flex-flow-vertical-ttb'>vertical-ttb</dfn></dt>
+ <dd>Same as <i>vertical</i>, except the <i>main-start</i> direction is upwards and the <i>main-end</i> direction is downwards.</dd>
- <dt><dfn id='flex-flow-column-reverse'>columns-reverse</dfn></dt>
- <dd><i>Flexbox item</i>s are placed in same orientation as block boxes in current writing mode, but in opposite direction.</dd>
+ <dt><dfn id='flex-flow-row-vertical-btt'>vertical-btt</dfn></dt>
+ <dd>Same as <i>vertical</i>, except the <i>main-start</i> direction is downwards and the <i>main-end</i> direction is upwards.</dd>
+ </dl>
+ </dd>
+ </dl>
+
+ <p>The <i>cross axis</i> is always perpendicular to the <i>main axis</i>. The second keyword, or the lack of it, sets the cross directions (<i>cross-start</i> and <i>cross-end</i>), and dictates whether the flexbox is single-line or multi-line. The cross directions affect how individual <i>flexbox items</i> respond to the 'flex-align' property, and the direction in which multiple lines are stacked and aligned by the 'flex-line-pack' property.</p>
+
+ <p>If the second keyword is omitted, the flexbox is single-line, the <i>cross-start</i> direction is equivalent to either the "start" or "before" direction of the current writing mode, whichever is in the <i>cross-axis</i>, and the <i>cross-end</i> direction is the opposite direction of <i>cross-start</i>.</p>
+ <p>If the second keyword is provided, the flexbox is <a href="#multiline">multi-line</a>. The <i>cross-start</i> and <i>cross-end</i> directions are set as follows:</p>
+
+ <dl>
<dt><dfn id='flex-flow-wrap'>wrap</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. In horizontal writing modes, new lines are added in block direction. In vertical writing modes, new lines are added in inline direction.</dd>
+ <dd>The <i>cross-start</i> direction is equivalent to either the "start" or "before" direction of the current writing mode, whichever is in the <i>cross-axis</i>, and the <i>cross-end</i> direction is the opposite direction of <i>cross-start</i>.</dd>
<dt><dfn id='flex-flow-wrap-reverse'>wrap-reverse</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. New lines are added in direction opposite to the direction defined by 'wrap' value.</dd>
+ <dd>Same as <i>wrap</i>, except the <i>cross-start</i> and <i>cross-end</i> directions are swapped.</dd>
<dt><dfn id='flex-flow-wrap-up'>wrap-up</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. New lines are added above.</dd>
+ <dd>The <i>cross-start</i> direction is downwards and the <i>cross-end</i> direction is upwards.</dd>
<dt><dfn id='flex-flow-wrap-right'>wrap-right</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. New lines are added to the right.</dd>
+ <dd>The <i>cross-start</i> direction is to the left and the <i>cross-end</i> direction is to the right.</dd>
<dt><dfn id='flex-flow-wrap-down'>wrap-down</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. New lines are added below.</dd>
+ <dd>The <i>cross-start</i> direction is upwards and the <i>cross-end</i> direction is downwards.</dd>
<dt><dfn id='flex-flow-wrap-left'>wrap-left</dfn></dt>
- <dd>Flow of <i>flexbox item</i>s is wrapped into multiple lines as needed. New lines are added to the left.</dd>
+ <dd>The <i>cross-start</i> direction is to the right and the <i>cross-end</i> direction is to the left.</dd>
</dl>
- <p>Not all combinaiton of main-axis direction and flow direction are allowed, because some combinations don't make sense (for example "flex-flow: horizontal wrap-right" is not possible).</p>
+ <p class='note'>Note that not all combinations of first and second keyword are allowed by the property's syntax, as they don't all make sense. For example, ''flex-flow: horizontal wrap-right'' is an invalid declaration.</p>
<div class="example">
<p>Some examples of valid flows:</p>
@@ -293,8 +313,6 @@
flex-flow:vertical wrap-reverse } /* wrap direction is left-to-right (opposite to block direction) */</pre>
</div>
- <p>For details on wrapping into multiple lines, see <a href="#multiline">Multi-line flexbox</a></p>
-
<h2 id='flex-order'>
Display Order: the 'flex-order' property</h2>
Received on Saturday, 20 August 2011 00:16:26 UTC