Re: [csswg-drafts] [css-flexbox] flexbox spec isn't interoperable w/ existing implementations, RE `flex-basis` resolution for table wrapper box flex-items

For a normal flex item (e.g. a block) that has `width:100%` (with default flex-basis, in a horizontal flex container with a definite size, this isn't a problem, because the flex item's max-content size doesn't come into play in the algorithm.   In that scenario with a block flex item, the item's used `flex-basis` is `100%`, which we are allowed to resolve per flexbox spec section 9.2 step 3.A:
> If the item has a definite used flex basis, that’s the flex base size."

(The business about max-content size is a bit further down, in a case that we don't fall into for this block scenario -- see below.)

In contrast, for a flex item that is a table-wrapper-box (the scenario I care about here): the item's `flex-basis` and `width` will both necessarily be `auto` (because authors can't directly style those properties on the table wrapper box), which means we have a used `flex-basis` of `content` (per [definition of flex-basis:auto](https://drafts.csswg.org/css-flexbox/#valdef-flex-basis-auto), which means we do fall down to section 9.2 step 3.E, which says:
> size the item into the available space using its used flex basis in place of its main size, treating a value of content as max-content

So we're effectively trying to resolve the size of a table-wrapper-box that has "width:max-content", and by definition, that max-content width isn't influenced by the containing block's size (and so the percent on the child can't resolve against it, for the benefit of computing the used flex basis). But in practice, all browsers that I've tested (besides Firefox Nightly from the past few days) *do* let the percent be resolved and let it influence the flex base size (and hence the actual flex item size) -- testcase: https://jsfiddle.net/x1te0pra/
 
(Both spec quotes here are from https://drafts.csswg.org/css-flexbox/#algo-main-item )

Suggestion: Maybe we need a special case for table wrapper boxes in section 9.2 step 3.E, where we treat `content` as `fit-content` for table wrapper boxes? (not `max-content`)  That's effectively what Firefox was doing up until recent nightlies, and that would allow percentages on the table-box to be resolved & to influence the flex base size.

-- 
GitHub Notification of comment by dholbert
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2604#issuecomment-383662108 using your GitHub account

Received on Monday, 23 April 2018 17:45:25 UTC