CSS3 Values and Units: Some proposals

I am new to www-style; I spent quite some hours searching the list archives - if these topics might have been discussed before, I apologize. (BTW, another Newbie question, is there any information available about when this more than 3 years old draft will proceed to the recommendation stadium?)

Looking through the CSS3 Values and Units draft, I found some things missing that I think would make meveryday work for me as an author easier:


1. Units that cover the maximum viewable or scrollable space

There are the vw, vh and vm units in the draft. However, they do not solve problems such as backgrounds that are not continued when scrolling is necessary. 

I suggest to add 2 more units, they might be named "page width" and "page height":
- pw: the viewport's width or maximum contents width, whichever is greater
- ph: the viewport's height or maximum contents height, whichever is greater 

Use case: A navigation column with a background. If the contents extend the viewport, the background of the navigation column is supposed to be continued to the bottom of the page - just the same behaviour as in a HTML3 table layout with <table height="100%">.


2. A method to adjust the dimensions of elements

I suggest to introduce a method to give some elements the same width or height, without knowing the appropriate value. This could be achieved by a function that looks for the computed dimensions of all elements covered by a selector, and gets the highest one.

Use cases: 
- Align labels and fields in a form without a table.
- Adjust several elements with position:absolute to each other, for example to achieve a multi-column layout

For a part of a simple form:
<p><label class="aligned">Age:</label><input type="text"></p>
<p><label class="aligned">Preferred tea:</label><input type="text"></p>

... the CSS could look like this:
label.aligned {
  width:max(width, .aligned);
}

The function max() takes 2 arguments:
- the dimension to be looked for
- the selector that covers the group of elements whose dimension is looked for


3. A unit computed against "the rest of the space"

This is meant similar to the star * in framesets. I admit I am astonished not to find this in the draft. 

Use case: Proportional, but not centered placement of an element. Example:

div#container {
  width:50em;
  margin-left:2*;
  margin-right:1*;
}
-- 
GRATIS für alle GMX-Mitglieder: Die maxdome Movie-FLAT!
Jetzt freischalten unter http://portal.gmx.net/de/go/maxdome01

Received on Wednesday, 17 March 2010 23:02:40 UTC