Re: Java style layout managers for CSS

Andrew Fedoniouk wrote:
> I am experimenting with Java style layout managers in CSS 
> and use home grown 'flow' style attribute for defining layout
> type. 
> 
> So far 'flow' gets following values:
> 
> flow:vertical 
>    - standard layout of <div> element.
> 
> flow:horizontal 
>    - same as above but child blocks layouted
>      in horizontal direction forming single row; 

/me coughs in a manner that sounds remarkably like "-moz-box-orient".

   It also sounds like you can simulate the latter with "display:
table-cell" and some creative selectors...

> flow:h-flow 
>    - this is close to Java's FlowLayout [1],
>      blocks layouted horizontally until space 
>      allows consequently forming rows;

   Couldn't you just style the child elements "display: inline-block"?

> flow:v-flow 
>    - this is close to column layout, 
>      blocks layouted from top to bottom.
>      On vertical overflow they are wrapped into new column;

   Hmm. Might be able to simulate this with CSS3 multi-column-related
properties, but not easily.

> Screenshot of  h-flow layout is here:
> http://terrainformatica.com/w3/h-flow.jpg
> 
> Each "flowed" container declared as:
>  
> <div class="container" >
>       <div class="sub">#1</div>
>       <div class="sub">#2</div>
>       <div class="sub">#3</div>
>       <div class="sub">#4</div>
>       <div class="sub">#5</div>
> </div>
> 
> Main differences of horizontal flows from
> existing methods like display:inline-block or 
> float: left are:
> 
> 1) margin collapsing between blocks works
>      in both directions - vertical and horizontal.
>      ( On screenshot above each child block 
>        has margin:20px set)
> 2) all blocks in row having height:auto 
>      (or 100%% in my case) are getting the 
>     same final (computed) height. 
> 
> My conclusions: 
> 
> These three new schemas:
> 1) are simple in use and in implementation;

   I suppose that would depend on the way the user agent renderer is coded.

> 2) due to their simplicity can be implemented 
>   uniformely in different UA's ;

   Perhaps. Mozilla already implements half of it.

> 3) can effectively eliminate need of tables for
>   layout purposes in typical cases.

   Why not just use CSS-based table layout? It's not like Microsoft's
going to support your new CSS properties before it supports CSS 2.1...

   I wouldn't mind seeing seeing a "box-orient" property. The other two
flow styles are debatable. Hmm...

Received on Thursday, 10 November 2005 07:15:00 UTC