Skip to content

[css-tables][css-flexbox] Table flex items with main size less than preferred intrinsic width #2442

Closed
@mstensho

Description

@mstensho

The engines differ greatly when it comes to sizing of table flex items. Edge and Firefox, on one hand, seem to use the table sizing algorithm extensively, and there's generally no support for flexing.

<p>There should be a green square, and no red.</p>
<div style="display:flex; width:200px; background:red;">
  <div style="display:table; flex:1 1; width:10px; height:200px; background:green;"></div>
</div>

Chrome, on the other hand, leave the flex sizing algorithm in charge, and the above test passes.

I'm pretty sure Chrome is doing the right thing here, but it causes a compatibility problem, if the specified main size is less than the intrinsic minimum width of the table.

<p>Shouldn't there be a green square, and no red?</p>
<div style="display:flex; width:200px; background:red;">
  <div style="display:table; width:10px; height:200px; background:green;">
    <div style="width:200px; height:10px; background:green;"></div>
  </div>
</div>

See https://bugs.chromium.org/p/chromium/issues/detail?id=821832

What's the desired behavior? Invalid bug? Ignore specified main size when resolving min-width:auto (initial value), and only honor intrinsic minimum width?

Fun fact: Both above tests pass in Presto. :)

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions