Closed Bug 1454330 Opened 6 years ago Closed 3 years ago

Bug css with tables as flex items only on Firefox

Categories

(Core :: Layout, defect, P3)

61 Branch
defect

Tracking

()

RESOLVED DUPLICATE of bug 1674302

People

(Reporter: koe.jimmy, Unassigned)

References

Details

(Keywords: dev-doc-needed, nightly-community)

Attachments

(1 file)

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
Component: Untriaged → Layout
Product: Firefox → Core
Attached file 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.
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.
Status: UNCONFIRMED → NEW
Ever confirmed: true
It's not a Chrome bug, work on Edge 41 :

https://image.ibb.co/me1Qj7/Capture.png
Priority: -- → P3
See Also: → 1673006

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.

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.)

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.

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

Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: