Re: Flex items growing unless they wrap to a line of their own

On 13 January 2015 at 21:39, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> On Tue, Jan 13, 2015 at 4:44 AM, Sebastian Zartner
> <sebastianzartner@gmail.com> wrote:
>> On 12 January 2015 at 20:02, fantasai <fantasai.lists@inkedblade.net> wrote:
>>> On 01/12/2015 09:53 AM, Jared Wein wrote:
>>>>
>>>>
>>>> Thanks. I should note that another desired result would be the following:
>>>>
>>>> ----------------------------
>>>> |[    AAA    ][    BBB    ]|
>>>> |[    CCC    ]             |
>>>> ---------------------------|
>>>
>>>
>>> We're also in the process of adding a few features to CSS Grid that should
>>> make this layout fairly easy.
>>
>> I believe the latter use case really fits more to CSS Grid and CSS
>> Flexbox should just allow to not stretch the last element at all like
>> in Jared's first example.
>
> [...]
>  For example, I maintain a recipes app
> at <http://www.xanthir.com/recipes/> which uses Flexbox to lay out the
> list of recipes.  This is definitely not a grid, but it would still
> benefit from something that made the elements on the last line flex
> "about as much" as the elements on previous lines (rather than, as
> they currently do, often flexing a lot more, due to less items on the
> last line).

Not flexing them at all would result in a similar display and wouldn't
require additional calculations. What's the benefit of flexing them
according to your algorithm?

>> If it's really desired to also stretch the last element to some
>> extend, then I think instead of using "phantom" items the width of the
>> first element of the second to last line should be used. I.e. in the
>> example this would be the width of AAA.
>
> I don't understand why this would be better.  Any arbitrary item would
> work equally well; using the last one just simplifies things.  If
> you're saying we should use the *laid-out size* of an item on the
> previous line, the point is to do flexing while pretending there were
> enough items on the line to roughly fill it; using already-flexed
> items doesn't help here.

Right. My statement was based on Jared's second illustration, which
may probably better be solved using a grid layout.

Sebastian

Received on Wednesday, 14 January 2015 22:56:16 UTC