Skip to content

Commit 00339f3

Browse files
committed
[css-sizing] Move some edits back from Sizing 4 to Sizing 3, then cut Sizing 4 down to a delta spec.
1 parent 433c6df commit 00339f3

File tree

2 files changed

+36
-327
lines changed

2 files changed

+36
-327
lines changed

css-sizing-3/Overview.bs

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ Terminology</h2>
8080

8181
<dt><dfn id="definite" lt="definite|definite size">definite size</dfn>
8282
<dd>
83-
A size that can be determined without measuring content;
83+
A size that can be determined without performing layout;
8484
that is, a <<length>>,
8585
a measure of text (without consideration of line-wrapping),
8686
a size of the <a>initial containing block</a>,
@@ -146,7 +146,7 @@ Auto Box Sizes</h3>
146146
: <dfn>stretch-fit inline size</dfn>
147147
: <dfn>stretch-fit block size</dfn>
148148
:: Roughly, the <a>size</a> a box would take
149-
if it filled its <a>available space</a>
149+
if it filled the <a>available space</a>
150150
in the given axis.
151151
(See [[#extrinsic]].)
152152

@@ -312,7 +312,7 @@ New Keywords for 'width' and 'height'</h3>
312312
Containing Floats</h3>
313313

314314
Note: To ensure that a container sizes itself to contain any descendant floats,
315-
make sure it's a <a>formatting context</a>.
315+
make sure it's a <a>formatting context</a> root.
316316
For some layout modes, such as Grid and Flexbox,
317317
this is true automatically.
318318
For Block layout, this means using ''display: flow-root;''.
@@ -462,6 +462,28 @@ Stretch-fit Sizing</h3>
462462
Percentage Sizing</h3>
463463

464464
Percentages specify sizing of a box with respect to the box’s <a>containing block</a>.
465+
When calculating the <a>intrinsic size contribution</a> of the box,
466+
intrinsic sizes are instead treated as ''width/auto''.
467+
468+
<div class="example">
469+
For example, in the following markup:
470+
471+
<pre class='lang-html'>
472+
&lt;div style="width: min-content">
473+
&lt;div style="width: 50%;">
474+
LOOOOOOOOOOOOOOOOOOOONG
475+
&lt;/div>
476+
&lt;/div>
477+
</pre>
478+
479+
When calculating the width of the outer div,
480+
the inner div is treated as ''width: auto'',
481+
so the outer div sets itself to the width of the long word.
482+
Since the outer div's width didn't depend on "real" layout,
483+
though, it's treated as <a>definite</a>
484+
for resolving the inner div,
485+
whose width resolves to half that of the outer div.
486+
</div>
465487

466488
Although this may require an additional layout pass to re-resolve percentages in some cases,
467489
the ''min-width/auto'', ''min-width/min-content'', ''min-width/max-content'', and ''min-width/fit-content'' values

0 commit comments

Comments
 (0)