[csswg-drafts] [css-flex] Nobody follows the spec regarding intrinsic size of column flex container (#10779)

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

== [css-flex] Nobody follows the spec regarding intrinsic size of column flex container ==
```html
<!DOCTYPE html>
<style>
.flexbox {
  display: flex;
  flex-direction: column;
  border: solid;
}
.flexbox > div {
  flex: 1 1 100px;
  line-height: 200px;
  min-width: 0;
  min-height: 0;
}
</style>
<div class="flexbox">
  <div>Flex item</div>
</div>
```

According to https://drafts.csswg.org/css-flexbox-1/#intrinsic-main-sizes

> if a [flex container](https://drafts.csswg.org/css-flexbox-1/#flex-container) has a single [flex item](https://drafts.csswg.org/css-flexbox-1/#flex-item) with [flex-basis: 100px;](https://drafts.csswg.org/css-flexbox-1/#propdef-flex-basis) but a max-content size of 200px, then when the item is [flex-grow: 0](https://drafts.csswg.org/css-flexbox-1/#propdef-flex-grow), the flex container (and flex item) is 100px wide, but when the item is flex-grow: 1 or higher, the flex container (and flex item) is 200px wide.

So here the flex container should be 200px tall, but all Gecko/Blink/WebKit  produce 100px instead.

In Servo we are now following the spec so we modified this WPT: https://github.com/web-platform-tests/wpt/commit/6185316759deea9b747bb642d29fd74e6ce98119

But I wonder if the spec should change if the main implementations aren't planning to align with it.

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


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

Received on Monday, 26 August 2024 13:33:17 UTC