W3C home > Mailing lists > Public > www-style@w3.org > August 2012

Re: [css3-flexbox] is this correct use case?

From: Jon Rimmer <jon.rimmer@gmail.com>
Date: Thu, 2 Aug 2012 23:25:54 +1000
Message-ID: <CA+ZDCiAMWpUYQqBaarLRRQ2BQwi0uMkY9v0ajrX7WSk-m0rcfw@mail.gmail.com>
To: Andrew Fedoniouk <news@terrainformatica.com>
Cc: www-style@w3.org
On 2 August 2012 17:24, Andrew Fedoniouk <news@terrainformatica.com> wrote:
> Oh, thanks a lot. Seems like 'auto' margins treatment were added recently.
> Interesting. Close enough, indeed.
> Do you know what is flex value of 'auto' in margin-left:auto ?
> In other words: what would be computed
> values of margins/width here:
> .flex > div {
>   margin-left: auto;
>   width: auto; /* or shall it be flex-grow:1 ? */
>   margin-right: auto;
> }

I won't pretend to fully grasp the flexbox layout algorithm, but as I
understand it, auto margins do not participate in the actual flexing,
they're just a way of absorbing any remaining space that's left after
the flexible sizes have been resolved.

In your example, the div with width: auto would be sized as per its
min-width, which would be its content's minimum size, and any
remaining space would be distributed equally between the left and
right margins. If you used flex-grow: 1 instead, it would expand to
fill its flex container, leaving no remaining space, resulting in zero
size margins.

> And things like:
>   margin-left:1*auto;
>   margin-right:2*auto;
> seem like still not there yet.

No, as far as I can see such a thing is not possible without using
spacer elements instead of auto margins.

> --
> Andrew Fedoniouk.
> http://terrainformatica.com

Jon Rimmer
Received on Thursday, 2 August 2012 13:26:27 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:19 UTC