W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2019

[csswg-drafts] [css-grid] Don't expand flexible tracks under a min-content constraint (#3683)

From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
Date: Wed, 27 Feb 2019 17:53:53 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-415251624-1551290032-sysbot+gh@w3.org>
Loirooriol has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-grid] Don't expand flexible tracks under a min-content constraint ==
Consider this code: https://jsfiddle.net/wjthokzf/

```css
#wrapper {
  width: 0;
}
#grid {
  display: grid;
  float: left;
  grid-template-columns: minmax(0, 1fr);
  border: solid;
}
#item::before, #item::after {
  content: '';
  float: left;
  height: 50px;
  width: 50px;
}
```
```html
<div id="wrapper">
  <div id="grid">
    <div id="item"></div>
  </div>
</div>
```

The grid is sized under a min-content constraint. The sizing algorithm reaches https://drafts.csswg.org/css-grid/#algo-flex-tracks with a base size and growth limit of 0 for the column.

The free space is indefinite, so the used flex fraction is the result of finding the size of an fr, called with the column and the max-content contribution of the item (100px) as the space to fill. The leftover space is 100px, the flex factor sum is 1, the hypothetical fr size is 100px, and this is what the algorithm returns. So the flex fraction is 100px. And the base size of the column is set to 100px.

However, neither Chromium nor Firefox do this. The column is 0px wide.

So I think that this "Expand Flexible Tracks" step should only happen if the available space is definite, or if the grid is being sized under a max-content constraint. But not when under a min-content constraint.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3683 using your GitHub account
Received on Wednesday, 27 February 2019 17:53:54 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:44 UTC