Re: [css3-flexbox] "flex-basis: auto" means completely different things as specified value vs. computed value

On Fri, Jun 1, 2012 at 3:38 PM, Daniel Holbert <dholbert@mozilla.com> wrote:
> Preface: right now, the spec says:
> {
>  # If the value is ‘auto’ on a flex item, the computed value
>  # of flex-basis is the computed value of the element's main
>  # size property. Otherwise, ‘auto’ computes to itself.
> [1]
> }
>
> I have two (related) concerns about "flex-basis:auto" computing to the
> main size property's computed value.
>
> MAIN CONCERN: It's weird to have a particular value ("auto" in this
> case) mean two completely different things as a specified value vs. as a
> computed value.
> (to elaborate slightly: 'auto' as specified val means "use
> main-size-property computed value as my computed value", per spec-quote
> above. In contrast, 'auto' as computed val (e.g. taken from the main
> size property) tells the flexbox algorithm to use our max-content size
> as our hypothetical size.[2]  These are two completely different meanings.)

Yeah, it's a little weird, but the alternative is to come up with
*another* term meaning the same thing as 'auto', just for stacked-auto
situations like this.


> SUB-CONCERN: It's weird that "flex-basis:inherit" can end up inheriting
> a computed value of "auto", which then deceptively makes us _ignore_ our
> main-size property. (while a _specified_ value of "auto" would make us
> _use_ our main-size property)
>
> To illustrate these concerns, here's an example:
>
>  <div id="grandparent" style="display: flex">
>   <div id="parent" style="display:flex; flex-basis:auto; width:auto">
>     <div id="elem" style="flex-basis: inherit; width: 50px"></div>
>   </div>
>  </div>
>
> So -- what is the computed value of "flex-basis" on the innermost
> element ('elem') here?  And does the "width: 50px" have any effect on
> the rendering?  IIUC, the answers are "auto" and "no". (We inherit
> #parent's computed value, which is the computed value of #parent's own
> 'width' property, which happens to be "auto". So #elem gets a computed
> value of "auto". And then the flexbox algorithm tells us to treat a flex
> basis of "auto" as max-content. So, we never use the 50px.)

This is incorrect, because you're assuming that the "inherit" swap-out
occurs at computed-value time.  Instead, it happens at specified-value
time, when a cascaded value of "inherit" turns into a specified value
of the parent's computed value.

This isn't well-specified yet; wait for fantasai and I to reboot the
Cascade module later this year.  But it was decided last year as part
of the 2.1 edits clarifying when 'inherit' and 'initial' are swapped
out.

So, as far as I can tell, there's nothing to address.  Right?

~TJ

Received on Monday, 4 June 2012 17:54:21 UTC