Skip to content

Commit 98a15ef

Browse files
committed
[css-flexbox] bikeshed fixes
--HG-- extra : rebase_source : 25161f9f006edea5ae0032964e34d1a7086f03af
1 parent e03a832 commit 98a15ef

1 file changed

Lines changed: 71 additions & 58 deletions

File tree

css-flexbox/Overview.html

Lines changed: 71 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -202,7 +202,7 @@
202202
</a></p>
203203
<h1 class="p-name no-ref" id=title>CSS Flexible Box Layout Module Level 1</h1>
204204
<h2 class="no-num no-toc no-ref heading settled heading" id=subtitle><span class=content>Editor’s Draft,
205-
<span class=dt-updated><span class=value-title title=20131003>3 October 2013</span></span></span></h2>
205+
<span class=dt-updated><span class=value-title title=20131008>8 October 2013</span></span></span></h2>
206206
<div data-fill-with=spec-metadata><dl><dt>This version:<dd><a class=u-url href=http://dev.w3.org/csswg/css-flexbox/>http://dev.w3.org/csswg/css-flexbox/</a><dt>Latest version:<dd><a href=http://www.w3.org/TR/css3-flexbox/>http://www.w3.org/TR/css3-flexbox/</a><dt>Editor’s Draft:<dd><a href=http://dev.w3.org/csswg/css-flexbox/>http://dev.w3.org/csswg/css-flexbox/</a><dt>Previous Versions:<dd><a href=http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/ rel=previous>http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/</a><dd><a href=http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/ rel=previous>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/</a><dd><a href=http://www.w3.org/TR/2012/WD-css3-flexbox-20120322/ rel=previous>http://www.w3.org/TR/2012/WD-css3-flexbox-20120322/</a><dd><a href=http://www.w3.org/TR/2011/WD-css3-flexbox-20111129/ rel=previous>http://www.w3.org/TR/2011/WD-css3-flexbox-20111129/</a><dd><a href=http://www.w3.org/TR/2011/WD-css3-flexbox-20110322/ rel=previous>http://www.w3.org/TR/2011/WD-css3-flexbox-20110322/</a><dd><a href=http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/ rel=previous>http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/</a>
207207
<dt>Feedback:</dt>
208208
<dd><a href="mailto:www-style@w3.org?subject=%5Bcss-flexbox%5D%20feedback">www-style@w3.org</a>
@@ -239,17 +239,17 @@ <h2 class="no-num no-toc no-ref heading settled heading" id=status><span class=c
239239
“[css-flexbox] <em>…summary of comment…</em>
240240

241241
<p>
242-
This document was produced by the <a href=/Style/CSS/members>CSS Working Group</a>
243-
(part of the <a href=/Style/>Style Activity</a>).
242+
This document was produced by the <a href=http://www.w3.org/Style/CSS/members>CSS Working Group</a>
243+
(part of the <a href=http://www.w3.org/Style/>Style Activity</a>).
244244

245245
<p>
246246
This document was produced by a group operating under
247-
the <a href=/Consortium/Patent-Policy-20040205/>5 February 2004 W3C Patent Policy</a>.
248-
W3C maintains a <a href=/2004/01/pp-impl/32061/status rel=disclosure>public list of any patent disclosures</a>
247+
the <a href=http://www.w3.org/Consortium/Patent-Policy-20040205/>5 February 2004 W3C Patent Policy</a>.
248+
W3C maintains a <a href=http://www.w3.org/2004/01/pp-impl/32061/status rel=disclosure>public list of any patent disclosures</a>
249249
made in connection with the deliverables of the group;
250250
that page also includes instructions for disclosing a patent.
251-
An individual who has actual knowledge of a patent which the individual believes contains <a href=/Consortium/Patent-Policy-20040205/#def-essential>Essential Claim(s)</a>
252-
must disclose the information in accordance with <a href=/Consortium/Patent-Policy-20040205/#sec-Disclosure>section 6 of the W3C Patent Policy</a>.</div>
251+
An individual who has actual knowledge of a patent which the individual believes contains <a href=http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential>Essential Claim(s)</a>
252+
must disclose the information in accordance with <a href=http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure>section 6 of the W3C Patent Policy</a>.</div>
253253
<div data-fill-with=at-risk></div>
254254

255255
<h2 class="no-num no-toc no-ref heading settled heading" id=contents><span class=content>Table of contents</span></h2>
@@ -2908,16 +2908,19 @@ <h3 class="no-num no-ref heading settled heading" id=informative><span class=con
29082908
<h2 class="no-num no-ref heading settled heading" id=index><span class=content>
29092909
Index</span><a class=self-link href=#index></a></h2>
29102910
<div data-fill-with=index><ul class=indexlist>
2911-
<li>auto (value), <a href=#valuedef-auto0 title="section 7.3.3">7.3.3</a>
2912-
<li>auto (value), <a href=#valuedef-auto title="section 8.3">8.3</a>
2913-
<li>baseline (value), <a href=#valuedef-baseline title="section 8.3">8.3</a>
2914-
<li>center (value), <a href=#valuedef-center0 title="section 8.2">8.2</a>
2915-
<li>center (value), <a href=#valuedef-center1 title="section 8.3">8.3</a>
2916-
<li>center (value), <a href=#valuedef-center title="section 8.4">8.4</a>
2917-
<li>collapsed, <a href=#collapsed-flex-itemcollapsed title="section 4.4">4.4</a>
2911+
<li>align-content, <a href=#propdef-align-content title="section 8.4">8.4</a>
2912+
<li>align-items, <a href=#propdef-align-items title="section 8.3">8.3</a>
2913+
<li>align-self, <a href=#propdef-align-self title="section 8.3">8.3</a>
2914+
<li>auto<ul><li><small>value for flex-basis, <a href=#valuedef-auto0 title="section 7.3.3">7.3.3</a></small>
2915+
<li><small>value for align-self, <a href=#valuedef-auto title="section 8.3">8.3</a></small>
2916+
</ul><li>baseline, <a href=#valuedef-baseline title="section 8.3">8.3</a>
2917+
<li>center<ul><li><small>value for justify-content, <a href=#valuedef-center0 title="section 8.2">8.2</a></small>
2918+
<li><small>value for align-items, align-self, <a href=#valuedef-center1 title="section 8.3">8.3</a></small>
2919+
<li><small>value for align-content, <a href=#valuedef-center title="section 8.4">8.4</a></small>
2920+
</ul><li>collapsed, <a href=#collapsed-flex-itemcollapsed title="section 4.4">4.4</a>
29182921
<li>collapsed flex item, <a href=#collapsed-flex-itemcollapsed title="section 4.4">4.4</a>
2919-
<li>column-reverse (value), <a href=#valuedef-column-reverse title="section 5.1">5.1</a>
2920-
<li>column (value), <a href=#valuedef-column title="section 5.1">5.1</a>
2922+
<li>column, <a href=#valuedef-column title="section 5.1">5.1</a>
2923+
<li>column-reverse, <a href=#valuedef-column-reverse title="section 5.1">5.1</a>
29212924
<li>cross axis, <a href=#cross-axiscross-axis title="section 2">2</a>
29222925
<li>cross-axis, <a href=#cross-axiscross-axis title="section 2">2</a>
29232926
<li>cross-axis baseline, <a href=#cross-axis-baseline title="section 8.5">8.5</a>
@@ -2928,33 +2931,42 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
29282931
<li>cross-start, <a href=#cross-start title="section 2">2</a>
29292932
<li>definite, <a href=#definitedefinite-size title="section 9">9</a>
29302933
<li>definite size, <a href=#definitedefinite-size title="section 9">9</a>
2931-
<li>flex base size, <a href=#flex-base-size title="section 9.2">9.2</a>
2934+
<li>display, <a href=#propdef-display title="section 3">3</a>
2935+
<li>flex<ul><li><small>value for display, <a href=#valuedef-flex title="section 3">3</a></small>
2936+
<li><small>(property), <a href=#propdef-flex title="section 7.1">7.1</a></small>
2937+
</ul><li>flex base size, <a href=#flex-base-size title="section 9.2">9.2</a>
29322938
<li>flex basis, <a href=#flex-basis title="section 7.1">7.1</a>
2933-
<li>&lt;‘flex-basis’&gt; (value), <a href=#valuedef-flex-basis title="section 7.1">7.1</a>
2939+
<li>flex-basis, <a href=#propdef-flex-basis title="section 7.3.3">7.3.3</a>
2940+
<li>&lt;‘flex-basis’&gt;, <a href=#valuedef-flex-basis title="section 7.1">7.1</a>
29342941
<li>flex container, <a href=#flex-container title="section 3">3</a>
2942+
<li>flex-direction, <a href=#propdef-flex-direction title="section 5.1">5.1</a>
29352943
<li>flex direction, <a href=#flex-direction title="section 2">2</a>
2936-
<li>flex-end (value), <a href=#valuedef-flex-end0 title="section 8.2">8.2</a>
2937-
<li>flex-end (value), <a href=#valuedef-flex-end1 title="section 8.3">8.3</a>
2938-
<li>flex-end (value), <a href=#valuedef-flex-end title="section 8.4">8.4</a>
2944+
<li>flex-end<ul><li><small>value for justify-content, <a href=#valuedef-flex-end0 title="section 8.2">8.2</a></small>
2945+
<li><small>value for align-items, align-self, <a href=#valuedef-flex-end1 title="section 8.3">8.3</a></small>
2946+
<li><small>value for align-content, <a href=#valuedef-flex-end title="section 8.4">8.4</a></small>
2947+
</ul><li>flex-flow, <a href=#propdef-flex-flow title="section 5.3">5.3</a>
29392948
<li>flex formatting context, <a href=#flex-formatting-context title="section 3">3</a>
2949+
<li>flex-grow, <a href=#propdef-flex-grow title="section 7.3.1">7.3.1</a>
2950+
<li>&lt;‘flex-grow’&gt;, <a href=#valuedef-flex-grow title="section 7.1">7.1</a>
29402951
<li>flex grow factor, <a href=#flex-grow-factor title="section 7.1">7.1</a>
2941-
<li>&lt;‘flex-grow’&gt; (value), <a href=#valuedef-flex-grow title="section 7.1">7.1</a>
29422952
<li>flexible length, <a href=#flexible-length title="section 7.1">7.1</a>
29432953
<li>flex item, <a href=#flex-item title="section 4">4</a>
29442954
<li>flex layout, <a href=#flex-layout title="section 1">1</a>
29452955
<li>flex line, <a href=#flex-line title="section 6">6</a>
2956+
<li>&lt;‘flex-shrink’&gt;, <a href=#valuedef-flex-shrink title="section 7.1">7.1</a>
2957+
<li>flex-shrink, <a href=#propdef-flex-shrink title="section 7.3.2">7.3.2</a>
29462958
<li>flex shrink factor, <a href=#flex-shrink-factor title="section 7.1">7.1</a>
2947-
<li>&lt;‘flex-shrink’&gt; (value), <a href=#valuedef-flex-shrink title="section 7.1">7.1</a>
2948-
<li>flex-start (value), <a href=#valuedef-flex-start0 title="section 8.2">8.2</a>
2949-
<li>flex-start (value), <a href=#valuedef-flex-start1 title="section 8.3">8.3</a>
2950-
<li>flex-start (value), <a href=#valuedef-flex-start title="section 8.4">8.4</a>
2951-
<li>flex (value), <a href=#valuedef-flex title="section 3">3</a>
2959+
<li>flex-start<ul><li><small>value for justify-content, <a href=#valuedef-flex-start0 title="section 8.2">8.2</a></small>
2960+
<li><small>value for align-items, align-self, <a href=#valuedef-flex-start1 title="section 8.3">8.3</a></small>
2961+
<li><small>value for align-content, <a href=#valuedef-flex-start title="section 8.4">8.4</a></small>
2962+
</ul><li>flex-wrap, <a href=#propdef-flex-wrap title="section 5.2">5.2</a>
29522963
<li>hypothetical cross size, <a href=#hypothetical-cross-size title="section 9.4">9.4</a>
29532964
<li>hypothetical main size, <a href=#hypothetical-main-size title="section 9.2">9.2</a>
29542965
<li>indefinite, <a href=#indefiniteindefinite-size title="section 9">9</a>
29552966
<li>indefinite size, <a href=#indefiniteindefinite-size title="section 9">9</a>
2956-
<li>inline-flex (value), <a href=#valuedef-inline-flex title="section 3">3</a>
2957-
<li>&lt;integer&gt; (value), <a href=#valuedef-integer title="section 5.4">5.4</a>
2967+
<li>inline-flex, <a href=#valuedef-inline-flex title="section 3">3</a>
2968+
<li>&lt;integer&gt;, <a href=#valuedef-integer title="section 5.4">5.4</a>
2969+
<li>justify-content, <a href=#propdef-justify-content title="section 8.2">8.2</a>
29582970
<li>main axis, <a href=#main-axismain-axis title="section 2">2</a>
29592971
<li>main-axis, <a href=#main-axismain-axis title="section 2">2</a>
29602972
<li>main-axis baseline, <a href=#main-axis-baseline title="section 8.5">8.5</a>
@@ -2968,42 +2980,43 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
29682980
<li>min-content cross size, <a href=#min-content-cross-size title="section 9.8">9.8</a>
29692981
<li>min-content main size, <a href=#min-content-main-size title="section 9.8">9.8</a>
29702982
<li>multi-line, <a href=#multi-line title="section 6">6</a>
2971-
<li>none (value), <a href=#valuedef-none title="section 7.1">7.1</a>
2972-
<li>nowrap (value), <a href=#valuedef-nowrap title="section 5.2">5.2</a>
2973-
<li>&lt;number&gt; (value), <a href=#valuedef-number0 title="section 7.3.1">7.3.1</a>
2974-
<li>&lt;number&gt; (value), <a href=#valuedef-number title="section 7.3.2">7.3.2</a>
2983+
<li>none, <a href=#valuedef-none title="section 7.1">7.1</a>
2984+
<li>nowrap, <a href=#valuedef-nowrap title="section 5.2">5.2</a>
2985+
<li>&lt;number&gt;<ul><li><small>value for flex-grow, <a href=#valuedef-number0 title="section 7.3.1">7.3.1</a></small>
2986+
<li><small>value for flex-shrink, <a href=#valuedef-number title="section 7.3.2">7.3.2</a></small>
2987+
</ul><li>order, <a href=#propdef-order title="section 5.4">5.4</a>
29752988
<li>participates in baseline alignment, <a href=#baseline-participation title="section 8.3">8.3</a>
2976-
<li>row-reverse (value), <a href=#valuedef-row-reverse title="section 5.1">5.1</a>
2977-
<li>row (value), <a href=#valuedef-row title="section 5.1">5.1</a>
2989+
<li>row, <a href=#valuedef-row title="section 5.1">5.1</a>
2990+
<li>row-reverse, <a href=#valuedef-row-reverse title="section 5.1">5.1</a>
29782991
<li>scaled flex shrink factor, <a href=#scaled-flex-shrink-factor title="section 9.7">9.7</a>
29792992
<li>single-line, <a href=#single-line title="section 6">6</a>
2980-
<li>space-around (value), <a href=#valuedef-space-around0 title="section 8.2">8.2</a>
2981-
<li>space-around (value), <a href=#valuedef-space-around title="section 8.4">8.4</a>
2982-
<li>space-between (value), <a href=#valuedef-space-between0 title="section 8.2">8.2</a>
2983-
<li>space-between (value), <a href=#valuedef-space-between title="section 8.4">8.4</a>
2984-
<li>stretch (value), <a href=#valuedef-stretch0 title="section 8.3">8.3</a>
2985-
<li>stretch (value), <a href=#valuedef-stretch title="section 8.4">8.4</a>
2986-
<li>strut size, <a href=#strut-size title="section 9.4">9.4</a>
2987-
<li>wrap-reverse (value), <a href=#valuedef-wrap-reverse title="section 5.2">5.2</a>
2988-
<li>wrap (value), <a href=#valuedef-wrap title="section 5.2">5.2</a>
2993+
<li>space-around<ul><li><small>value for justify-content, <a href=#valuedef-space-around0 title="section 8.2">8.2</a></small>
2994+
<li><small>value for align-content, <a href=#valuedef-space-around title="section 8.4">8.4</a></small>
2995+
</ul><li>space-between<ul><li><small>value for justify-content, <a href=#valuedef-space-between0 title="section 8.2">8.2</a></small>
2996+
<li><small>value for align-content, <a href=#valuedef-space-between title="section 8.4">8.4</a></small>
2997+
</ul><li>stretch<ul><li><small>value for align-items, align-self, <a href=#valuedef-stretch0 title="section 8.3">8.3</a></small>
2998+
<li><small>value for align-content, <a href=#valuedef-stretch title="section 8.4">8.4</a></small>
2999+
</ul><li>strut size, <a href=#strut-size title="section 9.4">9.4</a>
3000+
<li>wrap, <a href=#valuedef-wrap title="section 5.2">5.2</a>
3001+
<li>wrap-reverse, <a href=#valuedef-wrap-reverse title="section 5.2">5.2</a>
29893002
</ul></div>
29903003

29913004
<h2 class="no-num no-ref heading settled heading" id=property-index><span class=content>
29923005
Property index</span><a class=self-link href=#property-index></a></h2>
2993-
<div data-fill-with=property-index><table class=proptable><thead><tr><th scope=col>Name<th scope=col>Value<th scope=col>Initial<th scope=col>Applies To<th scope=col>Inh.<th scope=col>%ages<th scope=col>Media<th scope=col>Animatable<th scope=col>Applies to<th scope=col>Canonical order<th scope=col>Computed value<th scope=col>New values<tbody>
2994-
<tr><th scope=row><a data-property="">display</a><td><td><td><td><td><td><td><td><td><td><td>flex | inline-flex
2995-
<tr><th scope=row><a data-property="">flex-direction</a><td>row | row-reverse | column | column-reverse<td>row<td><td>no<td><td>visual<td><td>flex containers<td><td>specified value<td>
2996-
<tr><th scope=row><a data-property="">flex-wrap</a><td>nowrap | wrap | wrap-reverse<td>nowrap<td><td>no<td><td>visual<td><td>flex containers<td><td>specified value<td>
2997-
<tr><th scope=row><a data-property="">flex-flow</a><td>&lt;flex-direction&gt; || &lt;flex-wrap&gt;<td>see individual properties<td><td>see individual properties<td><td>visual<td><td>flex containers<td><td>see individual properties<td>
2998-
<tr><th scope=row><a data-property="">order</a><td>&lt;integer&gt;<td>0<td><td>no<td><td>visual<td>yes<td>flex items and absolutely-positioned children of flex containers<td><td>specified value<td>
2999-
<tr><th scope=row><a data-property="">flex</a><td>none | [ &lt;‘flex-grow’&gt; &lt;‘flex-shrink’&gt;? || &lt;‘flex-basis’&gt; ]<td>see individual properties<td><td>see individual properties<td><td>visual<td><td>flex items<td>per grammar<td>see individual properties<td>
3000-
<tr><th scope=row><a data-property="">flex-grow</a><td>&lt;number&gt;<td>0<td><td>no<td><td>visual<td>yes, except between 0 and other values<td>flex items<td><td>specified value<td>
3001-
<tr><th scope=row><a data-property="">flex-shrink</a><td>&lt;number&gt;<td>1<td><td>no<td><td>visual<td>yes, except between 0 and other values<td>flex items<td><td>specified value<td>
3002-
<tr><th scope=row><a data-property="">flex-basis</a><td>auto | &lt;‘width’&gt;<td>auto<td><td>no<td>realtive to the flex container’s inner main size<td>visual<td>as width<td>flex items<td><td>as specified, with lengths made absolute<td>
3003-
<tr><th scope=row><a data-property="">justify-content</a><td>flex-start | flex-end | center | space-between | space-around<td>flex-start<td><td>no<td><td>visual<td><td>flex containers<td><td>specified value<td>
3004-
<tr><th scope=row><a data-property="">align-items</a><td>flex-start | flex-end | center | baseline | stretch<td>stretch<td><td>no<td><td>visual<td><td>flex containers<td><td>specified value<td>
3005-
<tr><th scope=row><a data-property="">align-self</a><td>auto | flex-start | flex-end | center | baseline | stretch<td>auto<td><td>no<td><td>visual<td><td>flex items<td><td>auto computes to parent’s align-items value; otherwise as specified<td>
3006-
<tr><th scope=row><a data-property="">align-content</a><td>flex-start | flex-end | center | space-between | space-around | stretch<td>stretch<td><td>no<td><td>visual<td><td>multi-line flex containers<td><td>specified value<td></table></div>
3006+
<div data-fill-with=property-index><table class=proptable><thead><tr><th scope=col>Name<th scope=col>Value<th scope=col>Initial<th scope=col>Applies to<th scope=col>Inh.<th scope=col>%ages<th scope=col>Media<th scope=col>Animatable<th scope=col>Canonical order<th scope=col>Computed value<th scope=col>New values<tbody>
3007+
<tr><th scope=row><a data-property="">display</a><td><td><td><td><td><td><td><td><td><td>flex | inline-flex
3008+
<tr><th scope=row><a data-property="">flex-direction</a><td>row | row-reverse | column | column-reverse<td>row<td>flex containers<td>no<td><td>visual<td><td><td>specified value<td>
3009+
<tr><th scope=row><a data-property="">flex-wrap</a><td>nowrap | wrap | wrap-reverse<td>nowrap<td>flex containers<td>no<td><td>visual<td><td><td>specified value<td>
3010+
<tr><th scope=row><a data-property="">flex-flow</a><td>&lt;flex-direction&gt; || &lt;flex-wrap&gt;<td>see individual properties<td>flex containers<td>see individual properties<td><td>visual<td><td><td>see individual properties<td>
3011+
<tr><th scope=row><a data-property="">order</a><td>&lt;integer&gt;<td>0<td>flex items and absolutely-positioned children of flex containers<td>no<td><td>visual<td>yes<td><td>specified value<td>
3012+
<tr><th scope=row><a data-property="">flex</a><td>none | [ &lt;‘flex-grow’&gt; &lt;‘flex-shrink’&gt;? || &lt;‘flex-basis’&gt; ]<td>see individual properties<td>flex items<td>see individual properties<td><td>visual<td><td>per grammar<td>see individual properties<td>
3013+
<tr><th scope=row><a data-property="">flex-grow</a><td>&lt;number&gt;<td>0<td>flex items<td>no<td><td>visual<td>yes, except between 0 and other values<td><td>specified value<td>
3014+
<tr><th scope=row><a data-property="">flex-shrink</a><td>&lt;number&gt;<td>1<td>flex items<td>no<td><td>visual<td>yes, except between 0 and other values<td><td>specified value<td>
3015+
<tr><th scope=row><a data-property="">flex-basis</a><td>auto | &lt;‘width’&gt;<td>auto<td>flex items<td>no<td>realtive to the flex container’s inner main size<td>visual<td>as width<td><td>as specified, with lengths made absolute<td>
3016+
<tr><th scope=row><a data-property="">justify-content</a><td>flex-start | flex-end | center | space-between | space-around<td>flex-start<td>flex containers<td>no<td><td>visual<td><td><td>specified value<td>
3017+
<tr><th scope=row><a data-property="">align-items</a><td>flex-start | flex-end | center | baseline | stretch<td>stretch<td>flex containers<td>no<td><td>visual<td><td><td>specified value<td>
3018+
<tr><th scope=row><a data-property="">align-self</a><td>auto | flex-start | flex-end | center | baseline | stretch<td>auto<td>flex items<td>no<td><td>visual<td><td><td>auto computes to parent’s align-items value; otherwise as specified<td>
3019+
<tr><th scope=row><a data-property="">align-content</a><td>flex-start | flex-end | center | space-between | space-around | stretch<td>stretch<td>multi-line flex containers<td>no<td><td>visual<td><td><td>specified value<td></table></div>
30073020

30083021

30093022
<h2 class="no-num heading settled" id=issues-index><span class=content>Issues Index</span><a class=self-link href=#issues-index></a></h2><div style="counter-reset: issue"><p class=issue>

0 commit comments

Comments
 (0)