W3C home > Mailing lists > Public > www-style@w3.org > March 2007

Equal width/height for grouped elements

From: Markus Jonsson <carnaby@passagen.se>
Date: Thu, 8 Mar 2007 10:43:41 +0100 (CET)
Message-ID: <32056605.1173347021817.JavaMail.apache@eni-cpps11.sth.basefarm.net>
To: www-style@w3.org

Hi!
There's no way to ensure that two or more elements will be presented with exactly the same width and/or height, unless they are given an 
absolute width. Sometimes you don't want to set absolute measures, instead they should depend on the content, which may not be forseeable.

Imagine if you put two block elements inside a table-cell, they would expand to be equally wide based on the widest element.
But if you want them placed in very different parts of the document, it's not possible to have this effect.
I suggest there should be a function to CSS like max-in-class(className) 
Then if you do like this:

(consider the divs to be inline-block)

<div class="colors" style="width: max-in-class('colors');"> red </div>
<div class="colors" style="width: max-in-class('colors');"> green </div>
<div class="colors" style="width: max-in-class('colors');"> blue </div>

- all elements would appear as wide as the "green" would have been on its own.
With this approach, the calling element doesn't necessarily have to be a member of the class it references. Thus, you could have an 
element getting its value from a class, still itself doesn't affect the max-value:

<div class="colors" style="width: auto"> red </div>
<div class="" style="width: max-in-class('colors');"> green </div>
<div class="" style="width: max-in-class('colors');"> blue </div>

So here, all elements appear only as wide as "red", even though both "green" and "blue" would normally be wider.
This is something that CSS is lacking, that I think would be really useful. Neither performance of implementation should be that 
complicated, I think.
Has such a feature been considered within the wroking groups?
Maybe it could be seen as somewhat similar to the concept of grid slots in the CSS3 Advanced Layout module.

Markus
Received on Thursday, 8 March 2007 09:43:58 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:50 GMT