Re: Unitless dimensions

On Tuesday 05 July 2005 19:28, Philip TAYLOR wrote:
> There was a very informative message on this (or a related) list
> not too long ago describing what the author referred to (I think)
> as a "little-known feature" of CSS whereby unitless dimensions
> (possibly in certain contexts) behaved in a useful but generally
> little-understood way.  I've tried to track this behaviour down,
> but with no success.  If the original poster, or someone familiar
> with this area of CSS, could either clarify or point me at
> the relevant spec., I'd be most grateful.

I'm not sure what message that was, but there is one property in CSS1 
that allows both units and unitless numbers (line-height) and there is 
a proposal for two more in CSS3 (width & height).

'Line-height: 1.2em' means a line height of that much for the current 
element and *identical* height for any children that inherit the 
property. Thus:

    <div style="font-size: 12px; line-height: 1.2em">
      This text has a font size of 12px and a line height of 14.4px.
      <div style="font-size: 10px">
        This text has a font size of 10px, but the line height
        is still 14.4px.
      </div>
    </div>

On the other hand, 'line-height: 1.2' means that the proportion is 
inherited, not the absolute value:

    <div style="font-size: 12px; line-height: 1.2">
      This text has a font size of 12px and a line height of 14.4px.
      <div style="font-size: 10px">
        This text has a font size of 10px, and a line height
        of 12px.
      </div>
    </div>

Sometimes you want the children to keep the same absolute line-height, 
sometimes you want the children to have the same proportional 
line-height. By using units or not, you can choose.

The proposal in the CSS3 Box model is to allow 'width: 0.75' to mean 
0.75 times the intrinsic size. For example:

    <img src="..." alt="..." style="width: 10em">

makes an image of 10em wide, while

    <img src="..." alt="..." style="width: 0.75">

makes an image that is reduced to 75% of its original width.

I've also seen discussion of allowing unitless numbers on 'word-spacing' 
in CSS3. Currently, 'word-spacing' adds a specific amount to the normal 
spacing (for example, 'word-spacing: 0.5em'). 'Word-spacing: 1.5' could 
mean that the word spacing is increased to 1.5 times its normal value.

We're not making use of unitless numbers a lot, but it is for allowing 
things like this that CSS has never defined a "default" unit.



Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France

Received on Tuesday, 5 July 2005 18:54:09 UTC