Re: Wrapping delimited lists, fluid rows

----- Original Message ----- 
From: "Daniel Beardsmore" <public@telcontar.net>
To: <www-style@w3.org>
Sent: Friday, February 23, 2007 6:35 PM
Subject: Re: Wrapping delimited lists, fluid rows

>
> Andrew Fedoniouk wrote:
>>
>> ----- Original Message ----- 
>> From: "Daniel Beardsmore" <public@telcontar.net>
>> To: <www-style@w3.org>
>> Sent: Thursday, February 22, 2007 8:15 PM
>> Subject: Wrapping delimited lists, fluid rows
>>
.............
>>
>>
>> Rules like
>>
>> ul.menu li:after { content: " |  " }
>> ul.menu li:last-on-line:after { content: none }
>>
>> effectively create oscillation condition in the layout algorithm.
>
> Right, it's nice to be told why things can't possibly ever conceivably 
> work, but
> how CAN it be made to work? How CAN we prevent undesirable glitches like 
> this,
> and go on to handle fluid grid rows?
>
> I don't care what the CSS looks like -- you must realise that precise CSS 
> is not
> the issue, but achieving the presentation goal is.
>
>

In htmlayout engine (html/css engine) I've added two things
for that:
1) attribute  flow: vertical | horizontal | h-flow | v-flow [1]
2) flex length unit: %% [2]

So to define let's say left-sidebar - content - right-sidebar
layout that is stable for the content it is enough to say:

<div id="body" style="flow:horizontal">
   <ul class="leftbar" ><ul>
   <div class="content"></div>
   <ul class="rightbar" ><ul>
</div>

.leftbar , .rightbar
{
    width:20em;
    height: 100%%; // full height of the #body content box
}

.content
{
    width:100%%; // all space left from leftbar and righbar
                           // in the #body content box
    height: 100%%; // full height of the #body content box
}

So this create expandable single row layout.
There is no way in modern HTML/CSS to reproduce
this except of using tables.

This is not exactly what you need but at least something
that can replace table use cases. In some cases
flex units (%%) can give even more than tables can handle.

Andrew Fedoniouk.
http://terrainformatica.com

[1] Flow attribute: http://www.terrainformatica.com/htmlayout/flow.whtm
[2] Flex units: http://www.terrainformatica.com/htmlayout/fspu.whtm

Demo the engine : 
http://www.terrainformatica.com/htmlayout/HTMLayoutDemo.zip
     /bin/browse.exe ( Windows or Linux/Wine)
Sidebar flex layout:
     /html_samples/generic/sidebars.htm
Various flow attribute demos:
    /html_samples/flows/*.htm

Received on Saturday, 24 February 2007 06:22:00 UTC