Re: [csswg-drafts] [css-multicol-2] `column-height` and nested fragmentation (#11977)

Regarding varying sized rows, this is already possible without nested fragmentation (provided that we still want `column-wrap`, and also want `column-height` to mean something even when `height` is auto):

```html
<!DOCTYPE html>
<div style="columns:2; column-wrap:wrap; background:yellow;">
  <div style="background:cyan;">
    <div style="break-after:column; height:40px;">Short row</div>
    <div style="break-after:column; height:40px;">Short row</div>
    <div style="break-after:column; height:100px;">Tall row</div>
    <div style="break-after:column; height:100px;">Tall row</div>
    <div style="break-after:column;">Tiny row</div>
    <div style="break-after:column;">Tiny row</div>
  </div>
</div>
```

<img width="466" height="194" alt="Image" src="https://github.com/user-attachments/assets/60779b31-7a91-4b30-906e-f7e3af6b6d97" />

But I digress.

For nested fragmentation, I think one of the following:

A: Rows fragment (like regular blocks) across fragmentainers. What's not spent of `column-height` in previous outer fragmentainers is available to subsequent fragmentainers. This follows the principle of not letting fragmentation disrupt layout more than necessary.

or

B: If a row doesn't fit in an outer fragmentainer, truncate it (yes, then we may get rows with varying size)

or

C: If a row doesn't fit in an outer fragmentainer, stretch the previous one to use all remaining space (yes, then we also may get rows with varying size)

-- 
GitHub Notification of comment by mstensho
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11977#issuecomment-3311994157 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 19 September 2025 12:23:46 UTC