- From: Tab Atkins Jr.. via cvs-syncmail <cvsmail@w3.org>
- Date: Sat, 20 Aug 2011 00:29:57 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-flexbox In directory hutz:/tmp/cvs-serv24612 Modified Files: Overview.html Overview.src.html Log Message: Added a note explaining the value of using the logical keywords over physical. Index: Overview.html =================================================================== RCS file: /sources/public/csswg/css3-flexbox/Overview.html,v retrieving revision 1.35 retrieving revision 1.36 diff -u -d -r1.35 -r1.36 --- Overview.html 20 Aug 2011 00:18:25 -0000 1.35 +++ Overview.html 20 Aug 2011 00:29:55 -0000 1.36 @@ -576,6 +576,18 @@ </dl> </dl> + <p class=note>Usually, the logical keywords are sufficient, which is why + their names are purposely short. For example, if the page's writing mode + is lr-tb, like it is when the primary language is English, the ‘<a + href="#flex-flow-row"><code class=css>row</code></a>’ value makes + the flexbox horizontal and going from left to right, while the ‘<a + href="#flex-flow-column"><code class=css>column</code></a>’ value + makes the flexbox vertical and going from top to bottom. If this were + specified as part of a page template, and the page as a whole was switched + to a tb-rl writing-mode like what Japanese uses, the flexboxes would + automatically shift to vertical and horizontal, respectively, which is + often what is desired. + <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 Index: Overview.src.html =================================================================== RCS file: /sources/public/csswg/css3-flexbox/Overview.src.html,v retrieving revision 1.34 retrieving revision 1.35 diff -u -d -r1.34 -r1.35 --- Overview.src.html 20 Aug 2011 00:18:25 -0000 1.34 +++ Overview.src.html 20 Aug 2011 00:29:55 -0000 1.35 @@ -271,6 +271,8 @@ </dd> </dl> + <p class='note'>Usually, the logical keywords are sufficient, which is why their names are purposely short. For example, if the page's writing mode is lr-tb, like it is when the primary language is English, the ''row'' value makes the flexbox horizontal and going from left to right, while the ''column'' value makes the flexbox vertical and going from top to bottom. If this were specified as part of a page template, and the page as a whole was switched to a tb-rl writing-mode like what Japanese uses, the flexboxes would automatically shift to vertical and horizontal, respectively, which is often what is desired.</p> + <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>
Received on Saturday, 20 August 2011 00:29:59 UTC