Re: [csswg-drafts] [css-flexbox] should a definite flex-basis always make the main size be definite? (#4311)

This change is good.

Compat will probably be ok, especially if Blink and Gecko sync up shipping this change.

To be clear, this **will** be a change for Blink. Blink's existing behavior is intentional that the red block's percent height resolves in the original test case [above](https://github.com/w3c/csswg-drafts/issues/4311#issue-493820930), but that giving the item `height:auto` and `flex-basis:100px` would make it not resolve. This is intentional because my understanding of https://drafts.csswg.org/css-flexbox/#definite-sizes and the prose in https://drafts.csswg.org/css2/#the-height-property indicates this behavior complies with the current specifications.

> One observation, though - when we update the spec text for this, we probably need to write the amended condition as actual authoritative spec-text rather than in a Note.

+1.
I further [contend](https://github.com/w3c/csswg-drafts/issues/4305#issuecomment-859122600) that the Note even as written today is inaccurate. Removing the Note and specifying this new behavior as normative would be **wonderful**. I think it would also let us close [issue 4305](https://github.com/w3c/csswg-drafts/issues/4305).

Last thing. I'm a *little* worried about performance. The original testcase has `min-height: 0`. But most flex items on the web will have to rely on automatic minimum sizing like the case below. So in the below case Blink will lay out the item with an indefinite height to get its [content size suggestion](https://drafts.csswg.org/css-flexbox/#content-size-suggestion), which will be 0. Then Blink will lay out the item post-flexing with a definite height which will cause the subtree to need a second layout, doubling layout time. If this pattern is nested the slowdown gets exponential. Would this cause any potential perf regressions for Gecko?

```html
<div style="display: flex; flex-direction: column; width: 100px; background: yellow;">
  <div style="flex: 1 1 100px; background: green;">
    <div style="height: 100%; background: red;"></div>
  </div>
</div>
```
Anyway, I haven't dug deeper on this potential performance issue, so if no one else is worried about performance, we shouldn't block this change just because of that.

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


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

Received on Saturday, 24 July 2021 23:20:15 UTC