Skip to content

Commit af54282

Browse files
committed
[css-flexbox] Define that min-size: auto is honored by percentages inside the item.
1 parent fdd9121 commit af54282

File tree

2 files changed

+44
-13
lines changed

2 files changed

+44
-13
lines changed

css-flexbox/Overview.bs

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -949,13 +949,10 @@ Implied Minimum Size of Flex Items</h3>
949949
this traversal is trivial and therefore not a performance concern.)
950950
</div>
951951

952-
In order to prevent cycling sizing,
953-
the ''auto'' value of 'min-height' and 'max-height'
954-
does not factor into the percentage size resolution of the box’s contents.
955-
For example, a percentage-height block whose flex item parent has
956-
''height: 120em; min-height: auto''
957-
will size itself against ''height: 120em'' regardless of the impact
958-
that 'min-height' might have on the used size of the flex item.
952+
Although this may require an additional layout pass to re-resolve percentages in some cases,
953+
the ''min-width/auto'' value of 'min-width' and 'min-height'
954+
(like the ''min-content'', ''max-content'', and ''fit-content'' values defined in [[CSS3-SIZING]])
955+
does not prevent the resolution of percentage sizes within the item.
959956

960957
<h2 id="flow-order">
961958
Ordering and Orientation</h2>
@@ -3332,6 +3329,23 @@ Substantive Changes and Bugfixes</h4>
33323329
Add explicit conformance criteria on authoring tools
33333330
to keep presentation and DOM order in sync
33343331
unless author explicitly indicates a desire to make them out-of-sync.
3332+
<li id="change-2015-min-auto-intrinsic-percentages">
3333+
Defined that any size adjustment imposed by a box’s ''min-height/min-width: auto''
3334+
is consulted when percentage-sizing any of its contents.
3335+
(<a href="https://drafts.csswg.org/css-flexbox/issues-lc-20150514#issue-3">Issue 3</a>)
3336+
<blockquote>
3337+
<p><del>In order to prevent cycling sizing,
3338+
the ''auto'' value of 'min-height' and 'max-height'
3339+
does not factor into the percentage size resolution of the box’s contents.
3340+
For example, a percentage-height block whose flex item parent has
3341+
''height: 120em; min-height: auto''
3342+
will size itself against ''height: 120em'' regardless of the impact
3343+
that 'min-height' might have on the used size of the flex item.</del>
3344+
<p><ins>Although this may require an additional layout pass to re-resolve percentages in some cases,
3345+
the ''min-width/auto'' value of 'min-width' and 'min-height'
3346+
(like the ''min-content'', ''max-content'', and ''fit-content'' values defined in [[CSS3-SIZING]])
3347+
does not prevent the resolution of percentage sizes within the item.</ins>
3348+
</blockquote>
33353349
</ul>
33363350

33373351
<h4 id="change-201505-clarify">
@@ -3561,6 +3575,7 @@ Substantive Changes and Bugfixes</h4>
35613575
Defined that any size adjustment imposed by a box’s ''min-height/min-width: auto''
35623576
is not consulted when percentage-sizing any of its contents.
35633577
(Issue <a href="http://dev.w3.org/csswg/css-flexbox-1/issues-lc-20140325#issue-27">27</a>)
3578+
This change was later reverted with an <a href="#change-2015-min-auto-intrinsic-percentages">opposite definition</a>.
35643579
<blockquote>
35653580
<p>In order to prevent cycling sizing,
35663581
the ''auto'' value of 'min-height' and 'max-height'

css-flexbox/Overview.html

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -303,7 +303,7 @@
303303
<div class="head">
304304
<p data-fill-with="logo"><a class="logo" href="http://www.w3.org/"> <img alt="W3C" height="48" src="https://www.w3.org/Icons/w3c_home" width="72"> </a> </p>
305305
<h1 class="p-name no-ref" id="title">CSS Flexible Box Layout Module Level 1</h1>
306-
<h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Editor’s Draft, <time class="dt-updated" datetime="2015-11-10">10 November 2015</time></span></h2>
306+
<h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Editor’s Draft, <time class="dt-updated" datetime="2015-12-01">1 December 2015</time></span></h2>
307307
<div data-fill-with="spec-metadata">
308308
<dl>
309309
<dt>This version:
@@ -1033,10 +1033,9 @@ <h3 class="heading settled" data-level="4.5" id="min-size-auto"><span class="sec
10331033
(For items with small amounts of content, however,
10341034
this traversal is trivial and therefore not a performance concern.)</p>
10351035
</div>
1036-
<p>In order to prevent cycling sizing,
1037-
the <a class="css" data-link-type="maybe" href="#valdef-min-width-auto">auto</a> value of <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> and <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-max-height">max-height</a> does not factor into the percentage size resolution of the box’s contents.
1038-
For example, a percentage-height block whose flex item parent has <a class="css" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-height">height: 120em; min-height: auto</a> will size itself against <a class="css" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-height">height: 120em</a> regardless of the impact
1039-
that <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> might have on the used size of the flex item.</p>
1036+
<p>Although this may require an additional layout pass to re-resolve percentages in some cases,
1037+
the <a class="css" data-link-type="maybe" href="#valdef-min-width-auto">auto</a> value of <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-width">min-width</a> and <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> (like the <span class="css">min-content</span>, <span class="css">max-content</span>, and <span class="css">fit-content</span> values defined in <a data-link-type="biblio" href="#biblio-css3-sizing">[CSS3-SIZING]</a>)
1038+
does not prevent the resolution of percentage sizes within the item.</p>
10401039
<h2 class="heading settled" data-level="5" id="flow-order"><span class="secno">5. </span><span class="content"> Ordering and Orientation</span><a class="self-link" href="#flow-order"></a></h2>
10411040
<p>The contents of a flex container can be laid out in any direction and in any order.
10421041
This allows an author to trivially achieve effects that would previously have required complex or fragile methods,
@@ -2893,6 +2892,22 @@ <h4 class="heading settled" id="change-201505-substantive"><span class="content"
28932892
<li id="change-2015-a11y-tools"><a class="self-link" href="#change-2015-a11y-tools"></a> Add explicit conformance criteria on authoring tools
28942893
to keep presentation and DOM order in sync
28952894
unless author explicitly indicates a desire to make them out-of-sync.
2895+
<li id="change-2015-min-auto-intrinsic-percentages">
2896+
<a class="self-link" href="#change-2015-min-auto-intrinsic-percentages"></a> Defined that any size adjustment imposed by a box’s <span class="css">min-width: auto</span> is consulted when percentage-sizing any of its contents.
2897+
(<a href="https://drafts.csswg.org/css-flexbox/issues-lc-20150514#issue-3">Issue 3</a>)
2898+
<blockquote>
2899+
<p>
2900+
<del>In order to prevent cycling sizing,
2901+
the <a class="css" data-link-type="maybe" href="#valdef-min-width-auto">auto</a> value of <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> and <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-max-height">max-height</a> does not factor into the percentage size resolution of the box’s contents.
2902+
For example, a percentage-height block whose flex item parent has <a class="css" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-height">height: 120em; min-height: auto</a> will size itself against <a class="css" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-height">height: 120em</a> regardless of the impact
2903+
that <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> might have on the used size of the flex item.</del>
2904+
</p>
2905+
<p>
2906+
<ins>Although this may require an additional layout pass to re-resolve percentages in some cases,
2907+
the <a class="css" data-link-type="maybe" href="#valdef-min-width-auto">auto</a> value of <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-width">min-width</a> and <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> (like the <span class="css">min-content</span>, <span class="css">max-content</span>, and <span class="css">fit-content</span> values defined in <a data-link-type="biblio" href="#biblio-css3-sizing">[CSS3-SIZING]</a>)
2908+
does not prevent the resolution of percentage sizes within the item.</ins>
2909+
</p>
2910+
</blockquote>
28962911
</ul>
28972912
<h4 class="heading settled" id="change-201505-clarify"><span class="content"> Clarifications</span><a class="self-link" href="#change-201505-clarify"></a></h4>
28982913
<h3 class="heading settled" id="changes-201409"><span class="content"> Changes since the 25 September 2014 LCWD</span><a class="self-link" href="#changes-201409"></a></h3>
@@ -3100,7 +3115,8 @@ <h4 class="heading settled" id="change-201403-substantive"><span class="content"
31003115
</blockquote>
31013116
<li id="change-201403-min-auto-intrinsic-percentages">
31023117
<a class="self-link" href="#change-201403-min-auto-intrinsic-percentages"></a> Defined that any size adjustment imposed by a box’s <span class="css">min-width: auto</span> is not consulted when percentage-sizing any of its contents.
3103-
(Issue <a href="http://dev.w3.org/csswg/css-flexbox-1/issues-lc-20140325#issue-27">27</a>)
3118+
(Issue <a href="http://dev.w3.org/csswg/css-flexbox-1/issues-lc-20140325#issue-27">27</a>)
3119+
This change was later reverted with an <a href="#change-2015-min-auto-intrinsic-percentages">opposite definition</a>.
31043120
<blockquote>
31053121
<p>In order to prevent cycling sizing,
31063122
the <a class="css" data-link-type="maybe" href="#valdef-min-width-auto">auto</a> value of <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-min-height">min-height</a> and <a class="property" data-link-type="propdesc" href="https://drafts.csswg.org/css2/visudet.html#propdef-max-height">max-height</a> does not factor into the percentage size resolution of the box’s contents.

0 commit comments

Comments
 (0)