[css3-flexbox] cascading of flex()

When flex(100px) is specified in a selector, we can't know if it will be applied to a flexbox item, so in cascading it has to be valid always and win over other valid values of lesser specificity.

Then

div { width:200px; width:flex(100px); }

must always be computed into "width:flex(100px)", even outside flexbox.

Now, when happens to not be a flexbox, what is computed value of 'width' ?

I see two options:

1)      100px (the 'preferred' part of flex)

2)      auto (initial value)
200px is not an option - it would be very difficult to require that parent of target is known when rule is parsed.

I would prefer the answer to be 100px - the "preferred" component of flex(). The outcome may be odd when "width:flex(1)" becomes "width:0" in non-flexbox layout... Even so I like it better than discarding specified preferred width.

It seems that use case of parent element switching layout from flexbox to something else (or from horizontal flexbox to vertical) is very valid. Then it would make sense to specify width as "flex()" and simply have flexibility ignored when not in flexbox primary direction...

Also consider 'inherit':

<div style="display:flexbox">
                <div style="width:flex(1 100px)">
                                <div style="width:inherit"></div>
                </div>
</div>

However artificial the case is, it seems wrong that the inner div would not get a usable specified width while width is specified on the parent, just with additional information.

I propose that the spec defines that flex(<preferred-width>) is treated as the specified <preferred-width> when applied to non-flexbox element.

Any arguments for 'auto' ?

Note that there will be no surprise in the outcome if flex() is defined to not change the default width/height. If "width:flex(1)" leaves 'width' at its initial value and simply adds flex where applicable. I would not be opposed to such change.

Alex

Received on Tuesday, 8 November 2011 13:02:44 UTC