Skip to content

Commit 6b41d0c

Browse files
committed
[css-sizing] Apply the resolution about 'height:stretch' acting like 'align-self:stretch' when possible, and remove the corresponding Extrinsic Sizing section.
1 parent c7b3c8c commit 6b41d0c

File tree

1 file changed

+24
-38
lines changed

1 file changed

+24
-38
lines changed

css-sizing-3/Overview.bs

Lines changed: 24 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -245,21 +245,32 @@ New Sizing Keywords</h2>
245245
New Keywords for 'width' and 'height'</h3>
246246

247247
<pre class=propdef partial>
248-
Name: width, min-width, max-width, height, min-height, max-height
248+
Name: width, max-width, height, max-height
249249
New values: stretch | max-content | min-content | fit-content | fit-content(<<length-percentage>>)
250250
</pre>
251251

252+
<pre class=propdef partial>
253+
Name: min-width, min-height
254+
New values: max-content | min-content
255+
</pre>
256+
252257
<p>There are four types of automatically-determined sizes in CSS (which
253258
are represented in the width and height properties by the keywords
254259
defined above):
255260

256261
<dl dfn-type=value dfn-for="width, min-width, max-width, height, min-height, max-height">
257-
<dt><dfn>stretch</dfn>
262+
<dt><dfn for="width, max-width, height, max-height">stretch</dfn>
258263
<dd>
259-
Use the <a>stretch-fit inline size</a> or <a>stretch-fit block size</a>,
260-
as appropriate to the writing mode.
261-
262-
NOTE: This is the formula used to calculate ''width/auto'' widths
264+
If 'align-self' or 'justify-self' (as appropriate to the relevant axis)
265+
is defined to apply,
266+
size the box as if ''align-self/stretch'' were specified for that property.
267+
(If the box does not exactly fill its <a>alignment container</a>,
268+
the <a>alignment properties</a> will dictate how the size differential is handled.)
269+
Otherwise,
270+
this value behaves as the initial value.
271+
272+
NOTE: For the <a>inline size</a> of a <a>block-level box</a>,
273+
this is exactly the formula used to calculate ''width/auto'' widths
263274
for non-replaced blocks in normal flow, see <a href="https://www.w3.org/TR/CSS2/visudet.html#blockwidth">CSS2.1§10.3.3</a>.
264275
It allows re-using this formula for boxes that are otherwise shrink-wrapped,
265276
like tables.
@@ -455,35 +466,10 @@ Extrinsic Size Determination</h2>
455466
<h3 id="stretch-fit-sizing">
456467
Stretch-fit Sizing</h3>
457468

458-
The inner <a>stretch-fit inline size</a> of a box is&hellip;
459-
460-
<!-- Based on https://lists.w3.org/Archives/Public/www-style/2009Nov/0286.html -->
461-
462-
<ul>
463-
<li>
464-
If the box is the root or is absolutely-positioned, the inline-size of its containing block, else
465-
<li>
466-
<code>max('min-inline-size'|0, min('max-inline-size'|infinity, 'inline-size'|<a>stretch-fit inline size</a>))</code>
467-
where the sizes are inner inline-sizes of the element establishing the box's <a>containing block</a>,
468-
and where the first value is used if it is <a>definite</a> and the second value otherwise.
469-
</ul>
469+
The inner <a>stretch-fit inline size</a> of a box is&hellip;
470470

471471

472-
&hellip;less the box's <a>inline-axis</a> margins
473-
(after any <a href="https://www.w3.org/TR/CSS2/box.html#collapsing-margins">margin collapsing</a>, and treating ''margin/auto'' margins as zero),
474-
borders, and padding,
475-
flooring at zero.
476472

477-
Issue: Shouldn't this be ignoring margin collapsing?
478-
479-
<p>
480-
The <a>stretch-fit block size</a> of a box is defined analogously,
481-
but in the other dimension.
482-
483-
<p class='issue'>
484-
This definition might end up skipping further up the ancestor chain than we'd like in some cases.
485-
<a href="http://lists.w3.org/Archives/Public/www-style/2012Oct/0204.html">Example.</a>
486-
Maybe it should stop at each formatting root, or something similar?
487473

488474
<h3 id="percentage-sizing">
489475
Percentage Sizing</h3>
@@ -515,7 +501,7 @@ Stretch-fit Sizing</h3>
515501
a 'block-size' or 'max-block-size' on the containing block
516502
that causes it to depend on the size of its contents,
517503
the box’s percentage is not resolved and instead <a>behaves as auto</a>.
518-
504+
519505
Note: <a href="https://www.w3.org/TR/css-grid/">Grid containers</a> (<a href="https://github.com/w3c/csswg-drafts/issues/1679">and flex items?</a>) do allow percentages to resolve in this case.
520506

521507
* Otherwise, the percentage is resolved against the containing block’s size.
@@ -555,7 +541,7 @@ Stretch-fit Sizing</h3>
555541
for resolving the <code>&lt;aside></code>,
556542
whose width resolves to half that of the <code>&lt;article></code>.
557543
</div>
558-
544+
559545
<div class="example">
560546
In this example,
561547

@@ -567,7 +553,7 @@ Stretch-fit Sizing</h3>
567553
<section style="height: 30px;"></section>
568554
</article>
569555
</xmp>
570-
556+
571557
because the percentage <a>block size</a> ('height', in this case) on block-level elements
572558
is defined to not resolve inside content-sized containing blocks,
573559
the percentage height on the <code>&lt;aside></code> is ignored,
@@ -577,9 +563,9 @@ Stretch-fit Sizing</h3>
577563
<div class=example>
578564
Issue: Letting %s still resolve against a definite 'height'
579565
when the min-height is intrinsic is an open issue.
580-
(CSS2 has a general statement about "height depending on contents",
581-
which this technically is,
582-
even though CSS2 didn't have content-dependent keywords for 'min-height'.
566+
(CSS2 has a general statement about "height depending on contents",
567+
which this technically is,
568+
even though CSS2 didn't have content-dependent keywords for 'min-height'.
583569
Since this is new, we think we could have this different behavior.)
584570

585571
The following examples illustrate how block-axis percentages resolve against a containing block whose size depends on its contents.

0 commit comments

Comments
 (0)