1454330 - Bug css with tables as flex items only on Firefox

Status: RESOLVED DUPLICATE of bug 1674302

(Core :: Layout, defect, P3)

Description

[koe.jimmy]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0
Build ID: 20180415220108

Steps to reproduce:

Sorry about my English :

Creation of flex container with <table></table> as children

https://codepen.io/alph4ratz/pen/oqKZqP


Actual results:

Flexbox doesn't work properly : flex properties and width size aren't considered


Expected results:

Like as Chrome, organize properly the flex even if items are tables

Comment 1

[Pascal Chevrel:pascalc]

Attachment: bug1454330.html

I am attaching a simpler testcase based ion Jimmy's codepen (thanks for it!) where we can see that flex-basis is not working on tables.

Comment 2

[Pascal Chevrel:pascalc]

Bug confirmed with ESR 52, 59 and nightly.
Chrome Dev 67 behaves as expected by the reporter.
Edge 40 behaves as Firefox so it may be a Chrome bug.

Setting display:block on the tables makes them behave as expected by the reporter.
I haven't found anything on MDN that indicates that flex items should not have "display: table;" set  for flex-* rules to work.

Therefore, regardless of whether this is a Chrome or a Firefox/Edge bug, I am adding the dev-doc-needed keyword for MDN so as that we document the difference in behaviour.

Maybe something of interest, the 'order' (setting order:3 on the first table for example) property does work on the tables so they seem to be detected as flex items.

Comment 3

[koe.jimmy]

It's not a Chrome bug, work on Edge 41 :

https://image.ibb.co/me1Qj7/Capture.png

Comment 4

[dgrogan (chrome)]

This is the same case as tested at https://wpt.fyi/results/css/css-flexbox/table-as-item-specified-width.html?label=experimental&label=master&aligned

Chrome 84 broke this rendering but we have a fix checked in, though the fix won't hit the stable channel until like Chrome 91.

Comment 5

[Philip Jägenstedt [:foolip]]

drgogan also made an good comment on this issue where I wondered if we shouldn't just change the spec:
https://github.com/web-platform-tests/wpt/issues/26257#issuecomment-715639328

(We should only if some implementer argues for it, and I'm not one.)

Comment 6

[Mats Palmgren (inactive)]

Fwiw, bug 1673006 will improve the rendering for the testcase in this bug too. We still don't render it exactly as Chrome in some cases though (when the window is very wide) so there's still some bug lurking.

Comment 7

[Ting-Yu Lin [:TYLin] (PST, UTC-8)]

Both the testcase in comment 1 and WPT table-as-item-specified-width.html is fixed by bug 1674302.