[csswg-drafts] [css-multicol] Specify intrinsic sizing of multicol (#4952)

fantasai has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-multicol] Specify intrinsic sizing of multicol ==
There's a first draft in Sizing 4 that's never made it into the WD, probably belongs in multicol. @tabatkins and I wrote these rules give the author-expected behavior; there was pushback from implementers on the fixed-height max-content width case because width depended on layout, but the implemented behavior was nonsense... Copying here for future reference.

```<h3 id="multicol-intrinsic">
Intrinsic Sizes in Multi-column Layout</h3>


<h4 id="multicol-min-content">
Min-content Sizes in Multi-column Layout</h3>

 <p>
  The <a>min-content inline size</a> of a multi-column container
  with a computed 'column-width' not ''column-width/auto''
  is the smaller of
  its 'column-width'
  and the largest <a>min-content inline-size contribution</a> of its contents.

 <p>
  The <a>min-content inline size</a> of a multi-column container
  with a computed 'column-width' of ''column-width/auto''
  is the largest <a>min-content inline-size contribution</a> of its contents
  multiplied by its 'column-count'
  (treating ''column-count/auto'' as ''1''),
  plus its 'column-gap' multiplied by 'column-count' minus 1.

<h4 id="multicol-max-content">
Max-content Sizes in Unconstrained-height Multi-column Layout</h3>

 <p>
  The <a>max-content inline size</a> of a multi-column container
  with unrestrained column heights
  and a computed 'column-count' not ''column-count/auto''
  is its 'column-count'
  multiplied by the larger of
  its 'column-width' (treating ''column-width/auto'' as zero)
  and the largest <a>min-content inline-size contribution</a> of its contents,
  plus its 'column-gap' multiplied by 'column-count' minus 1.

 <p class="note">
  Note that the contents of the multi-column container
  can still grow to be wider and shorter
  if the resulting column width is still smaller
  than the largest <a>max-content inline-size contribution</a> of its contents.

 <p>
  The <a>max-content inline size</a> of a multi-column container
  with unrestrained column heights
  and a computed 'column-count' of ''column-count/auto''
  is its 'column-width'
  multiplied by the number of columns obtained by taking all allowed column breaks [[CSS3-BREAK]],
  plus its 'column-gap' multiplied by that same number of columns minus 1.

 <!--
 The above was decided based on dholbert's example in http://lists.w3.org/Archives/Public/www-style/2012Oct/0017.html .
 These definitions make multicols work well in flexbox,
 both in ''stretch'' and non-''stretch'' cases,
 without wasted space or needless overflow.
 -->

<h4 id="multicol-max-content-restrained">
Max-content Sizes in Constrained-height Multi-column Layout</h3>

 <p>
  The <a>max-content inline size</a> of a multi-column container
  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)
  is the <a>inline size</a> that would exactly include all of its columns.
  It may be approximated by:

 <ul>
  <li>
   Laying out the element with column-spanning elements given ''display: none'',
   and taking a inline-size that includes all the columns.

  <li>
   Laying out all of the column-spanning elements into that resulting inline-size,
   and taking the resulting block-size.

  <li>
   Subtracting that resulting block-size from the specified restraint,
   laying out the element without column-spanning elements again into this adjusted block-size,
   and taking the inline-size of all its columns as its <a>max-content inline size</a>.
 </ul>

 <p>
  or by some more accurate method.

 <p class='note'>
  This approximation can result in some slack,
  but avoids overflow in the most common cases,
  where the balanced height of the columns above spanning elements are approximately equal.

 <p class='note'>
  In the common case of no column-spanning elements,
  this approximation collapses to simply doing a layout,
  and measuring the resulting columns.
```

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4952 using your GitHub account

Received on Wednesday, 15 April 2020 21:05:38 UTC