Cascading Style Sheets
Working Group Blog

Resolutions 2007-09 Beijing Part III: Rotation

By fantasai, 24 September 2007 (Permalink)
Categories: resolutions

Rotation

We reviewed Steve's email and also an internal generic "transform" proposal from Hyatt (which Hyatt will hopefully post to www-style at some point), spending most of the day discussing exactly how "rotation" would fit into the CSS layout model.

Rotation is still at a very experimental stage in CSS, so the following are not final decisions.

• Resolved: Margins specified on an element apply to its anonymous container, not the rotated block itself. However the behavior of margins for "tight-wrapped" blocks is not quite settled.
• Consensus: There are two types of rotation: rotation that happens during layout (and pushes aside content below it), and rotation that happens after layout.
• Resolved: Overflow of the border box due to rotation has the same effect as overflow of the border box due to relative positioning. Margins by themselves should never trigger overflow.
• Noted: Tight wrap discussions have been deferred to later, however the WG observes that in many cases one will want a fixed offset from the edge of the relevant polygon. This should follow the shape of the border edge, and might not be the margin edge. However the tight-wrap settings will probably also need a way to use the margins as applied to the border box instead of using only a fixed offset.
• Resolved: Rotation that affects layout creates a new "block formatting context". Rotation that doesn't, doesn't necessairly.
• Rotation: applies to all elements within the containing block: absolutely-positioned descendants that are positioned with respect to an ancestor containing block are not affected by the orientation.
• Resolved:
  • width: auto on a rotated element means use the available width before rotation.
  • width: max-intrinsic; rotate: rotate-to-fit-keyword enables the case where we shrinkwrap around the text to find its width and pick the smallest angle that will make that block fit.
  • width: shrinkwrap uses the available space after rotation, starting with one line and making the block taller and narrower as more content comes in, until it reaches its minimum content width (or min-width).

Article search

All Words
Some Word
Entire phrase