Re: [csswg-drafts] [css-multicol-2] `column-wrap`, `column-height` and column balancing (#11976)

I'm wondering if this resolution ("if there's not enough content to fill a column-height, we'll still maintain the column-height and just have empty space") effectively disables column balancing if `column-height` is non-auto.

(Spanners will still force preceding content to be balanced, of course, though)

This can be seen in my first example in my opening comment in this issue. So we went for option 2. Then is no column balancing to be seen, since everything is filled with cyan. The cyan block is fragmented, and gets stretched to take up whatever `column-height` says. Is this what we want? Maybe it is.

Is it fine that both the column line and the row get stretched to `column-height`, or should we only stretch the row, and only have the column line use what it needs?

I.e.

```html
<!DOCTYPE html>
<style>
  .mc {
    columns: 2 / 100px;
    line-height: 20px;
    orphans: 1;
    widows: 1;
    background:yellow;
  }
  .mc > div {
    background: cyan;
  }
  .mc > div > div {
    width: 50%;
    background: hotpink;
  }
</style>
<div class="mc">
  <div style="background:cyan;">
    <div style="break-after:column;">row 1</div>
    <div style="break-after:column;">row 1</div>
    <div>
      row 2<br>
      row 2<br>
      <div style="column-span:all; text-align:center; background:burlywood;">SQUIRREL</div>
      row 2<br>
      row 2<br>
    </div>
  </div>
</div>
```

What about the empty space?

A: Should it be taken up by the column lines (like option 2 in the original example)?

<img width="465" height="221" alt="Image" src="https://github.com/user-attachments/assets/a04b6b30-b6a8-43f1-8435-e418d88dee49" />

B: Or should it be just be taken up by the row (none of the options in the original example)?

<img width="466" height="221" alt="Image" src="https://github.com/user-attachments/assets/e1daeb70-1378-423a-9d45-5a1df5be643a" />

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


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

Received on Wednesday, 27 August 2025 09:14:47 UTC