Re: [CSS3] horizontal/vertical-align ?

--------------------------------------------------
From: "L. David Baron" <dbaron@dbaron.org>
Sent: Friday, April 23, 2010 11:22 PM
To: <www-style@w3.org>
Subject: Re: [CSS3] horizontal/vertical-align ?

> On Friday 2010-04-23 23:11 -0700, Andrew Fedoniouk wrote:
>> Question that bothers me quite some time:
>> why you think that Flexbox module with its eight or so properties is
>> better or easier to implement than single 'flow' property
>> and flex unit? If you add there fact that 'flow' covers
>> essential part of Template proposal with its own properties and
>> at least two additional length units then you will get
>> 
>>  1prop/1unit  against ~8props/2units
>> 
>> Why there is such an opinion here that 8props/2units will
>> require significantly less effort to implement or for
>> some other reasons better, understandable, etc.?
>> Have no idea to be short.
> 
> The existing box model is very complicated.  Many things are
> extremely hard to implement (hard enough that no browsers get them
> right):  margin collapsing, line layout around floats, etc.  Adding
> more features into an already extremely complicated model makes
> everything in the complicated mess harder to implement, since
> there's yet one more thing to worry about when implementing all the
> other pieces.
> 
> Flexbox is largely separate from the existing box model.  So instead
> of being mixed in with a complicated model, it has clear boundaries
> at the edges of that model, and is thus simpler.

David, are you saying that for the markup

    <div id="div1">
      <button id="button1">Hello</button>
      <button id="button2">Goodbye</button>
    </div>

these styles (taken from Flexbox document):

    #div1 { display: box; box-orient:horizontal; width: 300px; }
    #button1 { box-flex: 1.0; width: 100px; }
    #button2 { box-flex: 2.0; width: 140px; }

are easier to spec/have less interaction edges than this:

    #div1 { flow:horizontal; width: 300px; }
    #button1 { width: 1*;  }
    #button2 { width: 2*;  }

?

As for my educated knowledge flow/flex has exactly the same  
set of things that need to be specified.

box-orient:horizontal; is exactly flow:horizontal
so to specify flow:horizontal you will need 
same number of words as for box-orient:horizontal.
So is my confusion.

And BTW another question: 

what width will have box defined as: { box-flex: 1.0; width: 100px; }
?

As far as I understand if you have fixed width defined then 
you cannot speak about its flexibility anymore.
So it appears as box-flex is already conflicting with such basic 
property as width/height. How you guys solve such conflicts?

-- 
Andrew Fedoniouk

http://terrainformatica.com

Received on Saturday, 24 April 2010 07:27:04 UTC