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

Re: [css3-flexbox] absolutely positioned flex item should not have side effect on space distribution

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Mon, 23 Jul 2012 21:42:33 -0700
Message-ID: <CALRQH78Dr63LDCgLmiQnry2XqFZFH_u+-nqJdbkjeJbUuFbK4Q@mail.gmail.com>
To: fantasai <fantasai.lists@inkedblade.net>
Cc: John Hax <johnhax@gmail.com>, www-style@w3.org
I do not understand nature of this discussion to be honest.Why not to
use existing positioning mechanism with non flex children?

Consider this markup:

<div class=container>
    <div class=n1>#1</div>
    <div class=n2>#2</div>
    <div class=n3>#3</div>
<div>

With these styles (horizontal flex container):

      div.container { flow:horizontal; position:relative; }
      div.n1 { height:40px; width:*; background: magenta; }
      div.n2 { size:25px; position:absolute; top:15px; background: gold; }
      div.n3 { height:40px; width:2*; background: green; }

it will be rendered as this:
 http://terrainformatica.com/w3/flex-horizontal-abs.png

And with these:
      div.container { flow:vertical; height:*; width:max-content;
margin:0 auto; position:relative;}
      div.n1 { width:50px; height:*; background: magenta; }
      div.n2 { size:25px; position:absolute; left:25px; background: gold; }
      div.n3 { width:50px; height:2*; background: green; }

will be rendered as:
 http://terrainformatica.com/w3/flex-vertical-abs.png

So is the Proposal D

   The static position of the abspos item is set to right or left edge
of margin box of previous static element (in DOM order) as if the
positioned
   element attached to that edge and has zero length in flex axis direction.

-- 
Andrew Fedoniouk.

http://terrainformatica.com




On Mon, Jul 23, 2012 at 6:31 PM, fantasai <fantasai.lists@inkedblade.net> wrote:
> On 07/11/2012 03:34 AM, John Hax wrote:
>>
>> Absolutely positioned flex item should not have side effect on space
>> distribution. Since space-* is about distribute spaces
>> evenly,
>>
>>    A--B--C
>>
>> with B absolutely positioned, should be rendered as
>>
>>    A--C
>>
>> , where B is positioned at the middle of A and C if all
>> 'top'/'bottom'/'right'/'left' are 'auto'。
>
>
> I've summarized the state of the thread at
>   http://wiki.csswg.org/topics/flex-abspos-placeholders
>
> It would help if people gave solid arguments in favor of or against
> one or the other of the proposals, preferably with understandable
> use cases. :)
>
>
> So far we've had Kang-hao and Brad Kemper weigh in on
>
>   B > A > C
>
> From implementer's perspective, I suspect it would be more like
>
>   C > B > A
>
> I'm happy to spec anything, I just need people with informed opinions
> to inform us so the WG can make an informed decision. :)
>
> ~fantasai
>
Received on Tuesday, 24 July 2012 04:43:01 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:57 GMT