W3C home > Mailing lists > Public > www-style@w3.org > July 1999

Re: Rotated Content

From: Jan Roland Eriksson <rex@css.nu>
Date: Sun, 4 Jul 1999 15:32:12 -0400 (EDT)
Message-ID: <3785b59e.22950691@smtpserver.swip.net>
To: www-style <www-style@w3.org>
On Sun, 4 Jul 1999 15:33:01 +0100 (BST), you wrote:

>The reason I suggested that the rotation be based on the center of the box
>is that it is the easiest to imagine. For example, if you want to rotate
>something so that it was upside down, then 
>   .upside-down { position:relative; rotate: 180deg; }
>...would be enough. If you put the rotation's fulcrum somewhere else, e.g.
>at the top left hand corner (of what, though? The content, padding, border
>or margin edge?), then you would also have to offset the box to get it to
>stay in the same place!

I also reacted a bit on the suggestion of the centerpoint of the
rendering box as being the only point to use for rotation.

In my daily life I have reasons to use AutoCad as a tool to get my job
done. In that Cad program (and as well as in others I would think)
rotation of objects around just any point, "inside" or "outside" of the
object is fully possible. With the additional benefit of being able to
"snap" those rotation centers to predetermined points like "insert"
"midpoint" "center" "endpoint" "intersection" etc...

In the case of CSS, I think that "element center point" only, would be a
bit limitied. Adding at least the four corners of an established
rendering box, i.e. the four corners of the margin edges, would be

All this "rotation stuff" naturally also has to be evaluated from the
point of proper "fall back" into non CSS rendering situations.
I.e. no specific markup should be needed that would move the rotated
element out of it's natural point in the flow of the doc content.

>Here is another example, this one puts the text "W3C Recommendation" along
>the left edge of the viewport, like is currently done in W3C
>Recommendations (but currently a graphic is used):
>   .document.type { 
>      position: fixed; height: 1em; width: 10em;
>      top: 4em; left: -4em; margin: auto; rotate: 90deg;
>      background: blue; color: white; text-align: center;
>      font: light 1em sans-serif;
>   }

Can I from this part deduct that properties like "top" and "left" do
_not_ rotate with the element? What happens to the rendering box at
let's say only a 10 degree rotation?

Have that at all been touched yet? What is it that is to be rotated? The
"forground" of a rendering box with a box size that autoadjusts in size
as needed? or is it the whole box that is to be rotated?

What all this seems to point at is that 90, 180 and 270 degree rotations
would be fairly simple to implement regardless of box or foreground
rotation is chosen as the method, but all the inbetweens will create
severe problems for sure.

Jan Roland Eriksson <rex@css.nu> .. <URL:http://css.nu/>
Received on Monday, 5 July 1999 10:29:12 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:50 UTC