Re: [css3-2d-transforms][css3-3d-transforms] Clarify equivalency with position: relative

On Oct 22, 2010, at 7:55 pm, Sylvain Galineau wrote:

> In CSS3 2D Transforms[1], we have: 
> 
> # The transform property does not affect the flow of the content 
> # surrounding the transformed element. However, the value of the 
> # overflow area takes into account transformed elements. This 
> # behavior is similar to what happens when elements are translated 
> # via relative positioning.
> 
> In CSS3 3D Transforms [2] :
> 
> # The object acts as though position: relative has been specified, but also acts as a containing block for fixed positioned descendants.
> 
> This language is rather stronger e.g. it could be read as saying top and left position the element like they would a position:relative 
> element. However, in the perspective property definition [3], we have:
> 
> # ...It also establishes a containing block (somewhat similar to position:relative), 
> 
> Which would imply it's not supposed to act as though it was position:relative.

This is the correct interpretation. I agree that the wording needs work. A better way to state it might be:

Transforms affect an element in the same way that position: relative does. Transforms do not affect the pre-transformed size or position of the element or the layout of surrounding elements, but do affect overflow in the same way that position: relative does.

Transforms do imply position: relative. In other words, if you transform a position: static element, the 'top' and 'left' properties do not suddenly apply.

Transforms do make an element the containing block for positioned (absolute or relative) descendants. In WebKit, we also treat transformed elements as the containing block for fixed position descendants, but there's some debate over whether this is the appropriate behavior.

Transforms are considered to apply "after" the positioning. So, a position: fixed element that is also transformed will still be fixed relative to the viewport, with the transform applying based on the pre-transformed location.

Simon

Received on Tuesday, 16 November 2010 05:57:04 UTC