[csswg-drafts] [css-sizing] Stretch-fitting inline size next to floats. (#4028)

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

== [css-sizing] Stretch-fitting inline size next to floats. ==
https://drafts.csswg.org/css-sizing-4/#stretch-fit-sizing
https://drafts.csswg.org/css-sizing-3/#auto-box-sizes

The spec currently doesn't provide a size keyword to achieve this effect, but there used to be one named "fill-available", then renamed to "fill", "stretch" and/or "stretch-fit".

The behavior is partially defined, though, in level 3.
"The size a box would take if its outer size filled the available space in the given axis; in other words, the stretch fit into the available space, if that is definite."

Furthermore, the spec already refers to stretch-fit sizing as part of resolving fit-content, so my question is: How is stretch-fitting in the inline dimension affected by adjacent floats?

```
<style>
  .outerfloat { float:left; width:100px; height:100px; background:blue; }
  .stf { overflow:hidden; width:fit-content; background:yellow; }
  .spacer { float:left; width:300px; height:10px; }
</style>
<div style="width:500px;">
  <div class="outerfloat"></div>
  <div class="stf">
    <div class="spacer"></div>
    <div class="spacer"></div>
  </div>
</div>
```

Should the yellow box fit to the right of the yellow box, or go below, and use the entire width of its containing block?

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

Received on Tuesday, 11 June 2019 08:35:57 UTC