You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css3-flexbox/Overview.src.html
+5-3Lines changed: 5 additions & 3 deletions
Original file line number
Diff line number
Diff line change
@@ -912,9 +912,11 @@ <h2 id='layout-algorithm'>
912
912
<p>If the flexbox is multi-line, group the flexbox items into multiple lines:</p>
913
913
914
914
<ol>
915
-
<li>Determine the flexbox's available space by finding the size of the flexbox's parent's content box in the flexbox's main axis, and subtracting the size of the flexbox's margins, borders, and padding in the main axis.</li>
915
+
<li>Determine the main size of the flexbox's content box.
916
916
917
-
<li>Collect as many consecutive flexbox items as possible, starting from the first item, while keeping the sum of their main size smaller than the flexbox's available space. The items so collected form a single flexbox line.</li>
917
+
<pclass='issue'>Fill in the details about how to do so when the width is min/max/fit-content. This is complicated for multiline, especially for ''flex-flow:column''!</p></li>
918
+
919
+
<li>Collect as many consecutive flexbox items as possible, starting from the first item, while keeping the sum of their main size smaller than the flexbox's available space. If a flexbox item is sized with a flexible length, then for the purpose of this step, clamp the item's size between its minimum and maximum main sizes. The items so collected form a single flexbox line.</li>
918
920
919
921
<li>Repeat the previous step, starting each time from the first flexbox item not yet collected into a flexbox line, until all flexbox items have been collected into flexbox lines.</li>
920
922
</ol>
@@ -923,7 +925,7 @@ <h2 id='layout-algorithm'>
923
925
<li>
924
926
<p>Find the actual main size of the flexbox, per the standard rules for blocks (for block flexboxes) or inline-blocks (for inline flexboxes).</p>
925
927
926
-
<p>The min-content, max-content, or fit-content size of a flexbox in the main axis can be determined by, for each flexbox line, summing the min-content, max-content, or fit-content (as appropriate) sizes in the main axis of the flexbox items, and then returning the maximum of these sums.</p>
928
+
<pclass='issue'>Address min/max/fix-content here as well. Perhaps just combine this step with the previous?</p>
927
929
</li>
928
930
929
931
<li>For each flexbox line, <i>resolve the flexible lengths</i> of the items contained within it. All flexbox items now have a final main size. Update each item's hypothetical cross size based on this main size.</li>
0 commit comments