Sizing

I see a lack in the CSS specification regarding size which I believe should
be discussed for CSS3:


<- a ->
Absolute sizes of generated content are defined as the generated content's
size itself whereas relative sizes are interpreted as being relative to the
containing block's calculated size. With the current specification it's not
possible to scale images in DHTML by applying CSS attributes (given you
don't/can't use DOM properties to retrieve the original size of generated
content).

A new rule should be introduced for generated content to determine relative
sizes as being relative to the generated content's intrinsic size.


<- b ->
There is no way to scale a document, e.g. for printing.

What is rendered on screen always varies depending on the screen resolution.
Units like "pt" are never displayed in their correct sizes. Similar for
printing: "px" unit rules are never printed in the printer's resolution.


I suggest to introduce a scaling rule for CSS to be able to set scaling of
elements. Given this rule all the intrinsic quirks currently implemented
into browsers can be replaced by corresponding rules and unveil the
computing. It would also be possible to give separate rules for printing.

The new "scaling" rule should only allow
  * percentage values
  * a factor to set a fix scaling, using length units:
      something like
         "300pt" => 300 pixels equal one Point
         "500cm" => 500 pixels equal one Centimeter

(The second option is particularly useful to set image scaling with printer
driver values and font scaling with screen resolution settings. The syntax
is just a suggestion using existing parser functionality. Anything
equivalent is fine.)


Descending scaling rules should recognize existing scaling factors to
determine a computed scaling:

«html>
  «body style="scaling: 50%;">

    «p>
      This paragraph is rendered with a scaling of 50 %.
      The following image is rendered with 50 % of the browser's
      intrinsic scaling:«img href="..."/>
    «/p>

    «p style="scaling: 70%;">
      This paragraph is rendered with a scaling of 35 %.
      The following image is rendered with 35 % of the browser's
      intrinsic scaling:«img href="..."/>
    «/p>

    «p style="scaling: 200%;">
      This paragraph is rendered with a scaling of 100 %.
      The following image is rendered with 100 % of the browser's
      intrinsic scaling:«img href="..."/>
    «/p>

  «/body>
«/html>

RFC,
Axel Dahmen

Received on Sunday, 17 September 2006 11:14:30 UTC