Re: [css3-backgrounds] Percentage sizes and fixed backgrounds on the root element

On 02/07/2011 04:36 PM, Sylvain Galineau wrote:
>
> The question is whether the background sizing and positioning in this case is relative
> to the root element or to the viewport. Per CSS3 Backgrounds&  Border 3.11 [1] :
>
> "The background of the root element becomes the background of the canvas and its
> background painting area extends to cover the entire canvas, although any images
> are sized and positioned relative to the root element as if they were painted for
> that element alone. (In other words, the background positioning area is determined
> as for the root element.)"
>
> In this case IE9, Firefox and WebKit use the viewport for both positioning and
> sizing. Opera seems to use the viewport for positioning but the root element for
> sizing.
>
> In terms of which behavior makes the most sense, isn't the viewport the most
> logical positioning and sizing reference for fixed backgrounds in this case ?
> Otherwise, the background will move around as page content is added/removed.
> Also, if/when a 50-page document is paginated, should a fixed background on the
> root element with a 10% height be 5 pages tall ?
>
> [1] http://www.w3.org/TR/css3-background/#special-backgrounds

The behavior you want is most definitely the more reasonable interpretation. :)
It's actually already in the spec:

http://www.w3.org/TR/css3-background/#background-positioning-area
   # If the ‘background-attachment’ value for this image is ‘fixed’, then
   # this property has no effect: in this case the background positioning
   # area is the initial containing block [CSS21].

http://www.w3.org/TR/CSS21/colors.html#propdef-background-position
   # If the background image is fixed within the viewport (see the
   # 'background-attachment' property), the image is placed relative to
   # the viewport instead of the element's padding box.

I'll make a link from the instance of "background positioning area" you're
quoting to its definition (partially quoted above); that should help. Are
there any other clarifications you'd like to see?

~fantasai

Received on Wednesday, 9 February 2011 08:33:05 UTC