[csswg-drafts] [css-flexbox-1] flex-basis can not be smaller than min-content (#5367)

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

== [css-flexbox-1] flex-basis can not be smaller than min-content ==
I can't find this behavior specified anywhere in the current [spec](https://drafts.csswg.org/css-flexbox/#valdef-flex-flex-basis). But all current versions of the major browsers (Chrome 84, Firefox 78, Safari 13) set the minimal value of `flex-basis` to `min-content`. This makes `flex-basis` behave different from `width`/`height`, since you can't create overflow by making the box smaller than its contents. I don't see to use of this lower bound, since you could just as well use the `min-content` keyword. Is this a bug in the browsers or in the spec?

Minimal example

```html
<div class="container">
  <div class="mincontent">Lorem ipsum</div>
  <div class="smallerflexbasis">Lorem ipsum</div>
  <div class="smallerwidth">Lorem ipsum</div>
</div>
```

```css
.container {
  display: flex;
}

.container div {
  background-color: lightgrey;
  border: 1px solid black;
  margin: 0 10px;
  /* disable any flexible sizing */
  flex-grow: 0;
  flex-shrink: 0;
}

.mincontent {
  width: min-content;
}

.smallerflexbasis {
  flex-basis: 3ex;
}

.smallerwidth {
  width: 3ex;
}
```

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

Received on Tuesday, 28 July 2020 10:01:53 UTC