CSS: %% length unit. Proposal.

I propose CSS length unit: %% (double percent unit) which could be
applied to box dimensions and margins:

"The percentage is calculated with respect to the width of the generated
box's containing block *minus widths of all fixed elements in the line*".

If applied these units allow to position proportionally elements horizontaly
and verticaly without need to use tables.

Illustration
:
Lets say we have three blocks placed inline with widths 25%%, 100px and
75%%:
|<--25%%-->|<--fixed:100px-->|<------75%%------>|

Actual first and third block widths will be calculated from
ContainerContentWidth-100px weighted by their percentable values.

Other example - how to place div content in the center of browser view
horizontally and verticaly:

<body>
<div style=margin:50%%>Hey! I am in the center</div>
</body>

Being applied to text inline blocks this will allow to insert "spring"
elements in text:

<P>Here is first input element <INPUT width=100px> and here is another:
<INPUT width=100%%></P>
If we will use new schema then last input element will occupy the rest of
the line.

one more example:

<P><img src=hline.png style="width:25%%" />Caption<img src=hline.png
style="width:75%%" /></P>

I've implemented this alghorithm in my experimental rendering engine.
Implementation is pretty simple and do not increase comlexity of existing
layout
alghorithms significantly. This will allow to avoid using tables in most use
cases.

If anybody want to take a look just drop me message.

Andrew Fedoniouk.
MS, Physics and Applied Mathematics.
Terra Informatica Sofrware Design.
http://TerraInformatica.com
Richmond. British Columbia. Canada.

Received on Thursday, 6 May 2004 23:02:45 UTC