Re: [csswg-drafts] [css-flexbox-2] Add flex-wrap: balance; (#3070)

The CSS Working Group just discussed `[css-flexbox-2] Add flex-wrap: balance;`, and agreed to the following:

* `RESOLVED: Add a flexbox level 2 with flex balance feature, syntax TBD`

<details><summary>The full IRC log of that discussion</summary>
&lt;kbabbitt> TabAtkins: we've been wanting some way fo balanancing flex lines forever<br>
&lt;kbabbitt> ... ian spent some time putting together an experimental impl<br>
&lt;kbabbitt> ... available in chrome 138 with experimental web platform features<br>
&lt;kbabbitt> ... quick description of what we've proposed, details are malleable:<br>
&lt;kbabbitt> ... syntactically this is just an addition to flex-wrap property<br>
&lt;kbabbitt> ... balance keyword with optional integer with # of lines to balance<br>
&lt;kbabbitt> ... behavior is: figure out how many lines flexbox will have, or estimate with basic layout<br>
&lt;kbabbitt> ... and distribute in balanced fashion instead of greedy fashion<br>
&lt;kbabbitt> ... current behavior is to use same size as for line breaking<br>
&lt;kbabbitt> ... potentially other ways to balance things nicely across multiple rows<br>
&lt;kbabbitt> ... minimum lines feature, integer, is required for cases where it's a column flexbox where available space is infinite and you would never wrap<br>
&lt;kbabbitt> ... in wikipedia bibliography, cuyrrently done using expensive manual code<br>
&lt;kbabbitt> ... could insteadf be done with a flexbox with 2 columns<br>
&lt;kbabbitt> ... ends up being a simple feature overall<br>
&lt;kbabbitt> ... precise details we can continue to work out<br>
&lt;kbabbitt> ... we're asking to be able to add this to flexbox 2<br>
&lt;kbabbitt> fantasai: we have several things that should go into flex 2<br>
&lt;kbabbitt> TabAtkins: this is mature, we can open spec with it<br>
&lt;iank_> Received very positive developer feedback - https://bsky.app/profile/una.im/post/3lpcjcjn4w22r<br>
&lt;kbabbitt> fantasai: how gaps interact with flex algorithm<br>
&lt;Rossen4> ack SebastianZ<br>
&lt;kbabbitt> TabAtkins: request is open a new draft, flexbox 2, editor's draft, include at least this flex-wrap balance feature<br>
&lt;kbabbitt> ... and at editor's discretion whatever else we want to put in<br>
&lt;Rossen4> ack fantasai<br>
&lt;kbabbitt> fantasai: I think having a flex-wrap balance feature is a good idea and we should do it<br>
&lt;kbabbitt> ... some discussion about having balance stuff on item-pack instead of flex-wrap<br>
&lt;kbabbitt> ... in any case you probably want to split out whether you're wrapping and what direction from the style<br>
&lt;kbabbitt> ... just like we do for text balancing<br>
&lt;kbabbitt> ... the kind of, how you prefer to place items is a separate control<br>
&lt;kbabbitt> ... so I think it should be a separate property<br>
&lt;kbabbitt> ... last time we talkd about it, we tralked about item-pack: balance<br>
&lt;kbabbitt> ... happy with that or we can consider other things<br>
&lt;kbabbitt> TabAtkins: we need to resolve those remaining items questions sooner rather than later but I don't want to take one right now<br>
&lt;kbabbitt> fantasai; in any case it should be a separate property<br>
&lt;kbabbitt> TabAtkins: happy to figure that out in the draft<br>
&lt;kbabbitt> ... not looking to ship tomorrow, but ready to explore<br>
&lt;kbabbitt> Rossen4: proposal is to open new ED for flex level 2<br>
&lt;kbabbitt> ... and flex-wrap balance, and continue to work on it there<br>
&lt;kbabbitt> Rossen4: objections?<br>
&lt;kbabbitt> fantasai: happy to take a resolution to add a flex balance feature as long as it's a separate property<br>
&lt;kbabbitt> TabAtkins: happy to have flex balance feature, syntax TBD<br>
&lt;dholbert> I'm a little uneasy about the "leave how to balance up to implementations" part; want to be sure the behavior is reasonably specified<br>
&lt;dholbert> but not objecting to the feature in general<br>
&lt;kbabbitt> Rossen4: any objections?<br>
&lt;fantasai> PROPOSED: Add a flex wrap balance feature, as a property separate from flex-wrap<br>
&lt;kbabbitt> TabAtkins: syntax TBD as part of wrap up of item discussion<br>
&lt;kbabbitt> fantasai: but put something in spec right?<br>
&lt;kbabbitt> TabAtkins: yes, doesn't matter what yet, don't need to resolve on syntax yet<br>
&lt;kbabbitt> ... don't want to resolve on syntax until we have the wider discussion<br>
&lt;kbabbitt> fantasai: draft something into ED but draft as separate property<br>
&lt;kbabbitt> TabAtkins: we don't need that as part of the resolution<br>
&lt;kbabbitt> Rossen4: syntax TBD is good enough, we'll figure out what that syntax is<br>
&lt;kbabbitt> fantasai: happy to leave syntax TBD, would like it to not be flex [missed]<br>
&lt;kbabbitt> TabAtkins: will mark it off as flex bikeshed<br>
&lt;kbabbitt> RESOLVED: Add a flexbox level 2 with flex balance feature, syntax TBD<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3070#issuecomment-3303850157 using your GitHub account


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

Received on Wednesday, 17 September 2025 16:59:15 UTC