RE: [css3-background] background-position computed value

Sure.

Input / Specified
1              right 1px bottom 3px
2              10em bottom
3              bottom
4              left 27px bottom 5px
5              27px center
6              50% center
7              center 5px
8              right 5% bottom 10%
9              right 5px bottom 10%
10           left 5px bottom 10%

Computed (A)
1              right 1px bottom 3px
2              12345px 100%
3              50% 100%
4              left 27px bottom 5px
5              27px
6              50%
7              50% 5px
8              right 5% bottom 10%
9              right 5px bottom 10%
10           left 5px bottom 10%

Computed (B)
1              right 1px bottom 3px
2              12345px 100%
3              50% 100%
4              left 27px bottom 5px
5              27px
6              50%
7              50% 5px
8              95% 90%
9              right 5px bottom 10%
10           5px 90%

-Brian

From: Tab Atkins Jr. [mailto:jackalmage@gmail.com]
Sent: Monday, November 07, 2011 1:38 PM
To: Brian Manthos
Cc: www-style@w3.org
Subject: Re: [css3-background] background-position computed value

On Mon, Nov 7, 2011 at 11:26 AM, Brian Manthos <brianman@microsoft.com<mailto:brianman@microsoft.com>> wrote:
http://www.w3.org/TR/css3-background/#the-background-position

Computed value:

If one or two values are specified, for a <length> the absolute length, otherwise a percentage. If three or four values are specified, two pairs of a keyword plus a length or percentage.


background-position: right 1px bottom 3px, 10em bottom, bottom, left 27px bottom 5px, 27px center, 50% center, center 5px, right 5% bottom 10%;

What’s the computed value for this example?


(A)
background-position: right 1px bottom 3px, 12345px 100%, 50% 100%, left 27px bottom 5px, 27px, 50%, 50% 5px, right 5% bottom 10%, right 5px bottom 10%, left 5px bottom 10%;

(B)
background-position: right 1px bottom 3px, 12345px 100%, 50% 100%, left 27px bottom 5px, 27px, 50%, 50% 5px, 95% 90%, right 5px bottom 10%, 5px 90%;

(C)
Something else?


Note: The “12345px” occurrences in the above are a placeholder for the computed value of “10em”.

Um, C, because neither list seems to match your original example at all near the end.

Could you format this a bit differently, perhaps with interspersed comments numbering each layer?

~TJ

Received on Monday, 7 November 2011 22:02:48 UTC