Skip to content

Commit 978066c

Browse files
committed
[css-flexbox] Specify the heuristic for finding the intrinsic width of a multiline column flexbox.
1 parent 6dcbe9e commit 978066c

1 file changed

Lines changed: 11 additions & 20 deletions

File tree

css-flexbox/Overview.bs

Lines changed: 11 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2765,26 +2765,17 @@ Intrinsic Sizes</h3>
27652765
are the sum of the flex line cross sizes
27662766
resulting from sizing the flex container under a <a>cross-axis</a> <a>min-content constraint</a>/<a>max-content constraint</a>, respectively.
27672767

2768-
Issue: Current browsers set the flex container’s inner size
2769-
to the size of the largest min-content contribution,
2770-
instead of summing the lines.
2771-
This is clearly wrong,
2772-
as it is guaranteed to cause overflow if there are multiple lines.
2773-
2774-
<div class="issue">
2775-
In an ideal world, the multi-line cross size would be calculated by, one by one,
2776-
laying out elements with the constraint applied into the flex lines,
2777-
and whenever a new largest cross-size in a line is found,
2778-
redoing layout for all previous items in the line to match that width
2779-
(so you get accurate line-breaking).
2780-
2781-
Current browsers perform an approximation of this,
2782-
finding the largest intrinsic cross-size among *all* items
2783-
and then shrink-to-fit sizing everything into that much available space.
2784-
Is this approximation sufficiently useful to specify?
2785-
Can we do better?
2786-
</div>
2787-
2768+
For the purposes of the preceding paragraph,
2769+
if the <a>flex container</a> is ''flex-flow: column wrap;'',
2770+
then it's sized by first finding the largest <a lt="min-content contribution">min-content</a> or <a>max-content contribution</a>
2771+
as appropriate,
2772+
among the <a>flex items</a>,
2773+
then using that size as the <a>available space</a> in the <a>cross axis</a> for all of the <a>flex items</a> during layout.
2774+
2775+
Note: This gives a reasonable approximation of the size that the flex container should be.
2776+
It's not a <em>perfect</em> fit in some degenerate cases,
2777+
but doing it completely correct is insanely expensive,
2778+
and this works reasonably well.
27882779

27892780
The <strong>main-size <a lt="min-content contribution">min-content</a>/<a>max-content contribution</a> of a <a>flex item</a></strong>
27902781
is its outer <a lt="min-content size">min-content</a>/<a>max-content size</a>,

0 commit comments

Comments
 (0)