Re: [css3-flexbox] Trying out flex units again

On Wed, Feb 2, 2011 at 8:19 PM, Andrew Fedoniouk
<andrew.fedoniouk@live.com> wrote:
> As of min constraints for margins:
>
> If flex margin collapses/overlays with non-flex margin then
> the later one is used as a min constraint for the flex.

In the current conception, margins don't collapse in flexbox layout.
The use-cases where that would have been useful appear to be easily
addressable with flex-pack instead.

(But yes, in my earlier drafts where they did, an inflexible margin
collapsing with a flexible did alter the minimum size constraint.)


> In may implementation of flexes I am using existing 'border-spacing'
> CSS property. Fixed value of 'border-spacing' on flex container
> establishes min constraints for all flexes.
>
> So minimal value of the margin between two elements is
> max( border-spacing, fixed(margin-A), fixed(margin-B) )
>
> 'border-spacing' is pretty handy and quite popular with flexes.

Can you point me to some examples of it in use?


> Just for the note: I've implemented those additive flexes
> and no one developer use them (I used to have pretty noticeable bug
> in additive function implementation - no one mentioned it).
>
> I am estimating more than 500-1000 develpores at the moment who do
> CSS design with my version of flexes. No one asked for additive flexes
> and no one use them. Simple flex coefficient + min/max constraints
> is enough.  That is probably not that representative sampling if to compare
> with web designers auditorium but that are people who do
> real desktop app UI designs ...
>
> I was actually very surprised that anyone found additive flexes useful.
> I'd really appreciate if someone will show real life examples where
> they are the must.

dbaron offered a use-case - additive flexes are required to make
nested flexboxes do what you expect, and are used in, for example, the
url bar in the FF UI.

There are several other simpler use-cases, too.  For example, in a
horizontal nav, you may want each element to stretch so that there is
equal space on each side of the titles (thus, "About" would be
narrower in total than "Contact Us", but both would have the same
amount of whitespace surrounding them).  This is a real requirement
I've had before, and it does indeed create an attractive "balanced"
appearance.  In a vertical nav, you want to make sure that items with
one and two lines of text both look good, with the two-liners taking
up somewhat more space.


> BTW, about the 'flow'. I've designed recently
>
>  flow:radial;
>
> layout manager. Quite cool and useful for e.g. pie-menus.
> See http://en.wikipedia.org/wiki/Pie_menu
>
> That is again about separating of display [model]
> and the flow (actual layout manager)
>
> Consider this:
>
>  flow:radial; display:table;
>
> A bit artificial but why not?
> In any case it is far from 'flex-direction' by nature.

You are moving your own implementation in a direction far different
than what the CSSWG is doing.  You've apparently found some way to
reconcile flexes and block layout that works for you, and are now
using flexes as the underlying layout mechanism.  That's great, but
that's not what's happening here.  Our strategy instead is to define
several loosely-interacting layout managers with different underlying
constraint structures, and define how they tie together.

I'll feel free to plunder your stuff for good ideas, but don't expect
things to apply directly across.  ^_^

~TJ

Received on Thursday, 3 February 2011 18:30:42 UTC