@@ -131,20 +131,23 @@ Auto Box Sizes</h3>
131
131
and computed by the rules in <a href="http://www.w3.org/TR/CSS21/visudet.html#blockwidth">CSS2.1§10.3.3</a> .
132
132
133
133
: <dfn>max-content size</dfn>
134
- :: Roughly, the smallest <a>size</a> a box could take in a given axis
134
+ :: A box’s “ideal” <a>size</a> in a given axis when given infinite available space.
135
+ Usually this is the smallest <a>size</a> the box could take in that axis
135
136
while still fitting around its contents,
136
137
i.e. minimizing unfilled space while avoiding overflow.
137
138
138
139
: <dfn>max-content inline size</dfn>
139
- :: Roughly, the narrowest <a>inline size</a> a box could take while fitting around its contents
140
+ :: The box's “ideal” <a>size</a> in the <a>inline axis</a> .
141
+ Usually the narrowest <a>inline size</a> it could take while fitting around its contents
140
142
if <em> none</em> of the soft wrap opportunities within the box were taken.
141
143
(See [[#intrinsic]] .)
142
144
143
145
Note: This is called the “preferred width” in <a href="http://www.w3.org/TR/CSS21/visudet.html#float-width">CSS2.1§10.3.5</a>
144
146
and the “maximum cell width” in <a href="http://www.w3.org/TR/CSS21/tables.html#auto-table-layout">CSS2.1§17.5.2.2</a> .
145
147
146
148
: <dfn>max-content block size</dfn>
147
- :: Roughly, the <a>block size</a> of the content after layout.
149
+ :: The box's “ideal” <a>size</a> in the <a>inline axis</a> .
150
+ Usually the <a>block size</a> of the content after layout.
148
151
149
152
: <dfn>min-content size</dfn>
150
153
:: The smallest <a>size</a> a box could take
@@ -174,17 +177,11 @@ Auto Box Sizes</h3>
174
177
: <dfn>fit-content inline size</dfn>
175
178
: <dfn>fit-content block size</dfn>
176
179
:: If the <a>available size</a> in a given axis is finite,
177
- equal to <code> min(<a>preferred size</a> , max(<a>min-content size</a> , <a>fill-available size</a> ))</code> .
180
+ equal to <code> min(<a>max-content size</a> , max(<a>min-content size</a> , <a>fill-available size</a> ))</code> .
178
181
Otherwise, equal to the <a>max-content size</a> in that axis.
179
182
180
183
Note: This is called the “shrink-to-fit” width in <a href="http://www.w3.org/TR/CSS21/visudet.html#float-width">CSS2.1§10.3.5</a>
181
184
and <a href="http://www.w3.org/TR/css3-multicol/#pseudo-algorithm">CSS Multi-column Layout § 3.4</a> .
182
-
183
- : <dfn>preferred size</dfn>
184
- : <dfn>preferred inline size</dfn>
185
- : <dfn>preferred block size</dfn>
186
- :: A box’s “ideal” <a>size</a> in a given axis.
187
- Unless otherwise specified, this is the <a>max-content size</a> .
188
185
</div>
189
186
190
187
<h3 id='contributions'>
@@ -198,11 +195,6 @@ Intrinsic Size Contributions</h3>
198
195
<dt> <dfn lt="min-content contribution|min-content inline-size contribution|min-content block-size contribution">min-content contribution</dfn>
199
196
<dd>
200
197
The size that a box contributes to its <a>containing block</a> 's <a>min-content size</a> .
201
-
202
- <dt> <dfn>preferred-size contribution</dfn>
203
- <dd>
204
- If the box's layout mode has a defined <a>preferred-size contribution</a> , that.
205
- Otherwise, the box's <a>max-content contribution</a> .
206
198
</dl>
207
199
208
200
<h3 id='constraints'>
@@ -218,11 +210,6 @@ Intrinsic Size Constraints</h3>
218
210
<dd>
219
211
A sizing constraint imposed by the box's <a>containing block</a>
220
212
that causes it to produce its <a>min-content contribution</a> .
221
-
222
- <dt> <dfn>preferred-size constraint</dfn>
223
- <dd>
224
- A sizing constraint imposed by the box's <a>containing block</a>
225
- that causes it to produce its <a>preferred-size contribution</a> .
226
213
</dl>
227
214
228
215
<h2 id='size-keywords'>
@@ -453,6 +440,10 @@ Intrinsic Sizes in Table Layout</h3>
453
440
<h3 id="multicol-intrinsic">
454
441
Intrinsic Sizes in Multi-column Layout</h3>
455
442
443
+
444
+ <h4 id="multicol-min-content">
445
+ Min-content Sizes in Multi-column Layout</h3>
446
+
456
447
<p>
457
448
The <a>min-content inline size</a> of a multi-column element
458
449
with a computed 'column-width' not ''column-width/auto''
@@ -467,14 +458,23 @@ Intrinsic Sizes in Multi-column Layout</h3>
467
458
multiplied by its 'column-count'
468
459
(treating ''column-count/auto'' as ''1'' ).
469
460
461
+ <h4 id="multicol-max-content">
462
+ Max-content Sizes in Unconstrained-height Multi-column Layout</h3>
463
+
470
464
<p>
471
465
The <a>max-content inline size</a> of a multi-column element
472
466
with unrestrained column heights
473
467
and a computed 'column-count' not ''column-count/auto''
474
468
is its 'column-count'
475
469
multiplied by the larger of
476
470
its 'column-width' (treating ''column-width/auto'' as zero)
477
- and the largest <a>max-content inline-size contribution</a> of its contents.
471
+ and the largest <a>min-content inline-size contribution</a> of its contents.
472
+
473
+ <p class="note">
474
+ Note that the contents of the multi-column element
475
+ can still grow to be wider and shorter
476
+ if the resulting column width is still smaller
477
+ than the largest <a>max-content inline-size contribution</a> of its contents.
478
478
479
479
<p>
480
480
The <a>max-content inline size</a> of a multi-column element
@@ -490,6 +490,9 @@ Intrinsic Sizes in Multi-column Layout</h3>
490
490
without wasted space or needless overflow.
491
491
-->
492
492
493
+ <h4 id="multicol-max-content-restrained">
494
+ Max-content Sizes in Constrained-height Multi-column Layout</h3>
495
+
493
496
<p>
494
497
The <a>max-content inline size</a> of a multi-column element
495
498
with restrained-height columns (i.e. a specified 'height' or 'max-height' , or whichever properties map to the <a>block size</a> of the element)
@@ -524,16 +527,6 @@ Intrinsic Sizes in Multi-column Layout</h3>
524
527
this approximation collapses to simply doing a layout,
525
528
and measuring the resulting columns.
526
529
527
- <p>
528
- The <a>preferred inline size</a> of a multi-column element
529
- with non-''column-width/auto'' 'column-width' and 'column-count'
530
- is the product of the 'column-width' and 'column-count' ,
531
- plus the appropriate amount of column gaps.
532
- In all other cases,
533
- it is the <a>max-content inline size</a> .
534
-
535
-
536
-
537
530
<h2 id='extrinsic'>
538
531
Extrinsic Size Determination</h2>
539
532
@@ -590,7 +583,6 @@ Changes</h2>
590
583
591
584
<ul>
592
585
<li> Changed <code> fill-available</code> keyword to <code> fill</code> .
593
- <li> Defined <a>preferred size</a> concept.
594
586
<li> Hooked up intrinsic sizes of replaced elements to the <a>default sizing algorithm</a> in [[!CSS3-IMAGES]] .
595
587
<li> Specified that <a>extrinsic sizing</a> treates ''margin/auto'' margins as zero.
596
588
<li> Clarified definition of <a>available size</a> .
0 commit comments