W3C home > Mailing lists > Public > www-style@w3.org > January 2012

RE: [css3-2d-transforms][css3-images] <position> grammar is duplicated or points to the wrong spec

From: Brian Manthos <brianman@microsoft.com>
Date: Tue, 24 Jan 2012 18:19:54 +0000
To: Sylvain Galineau <sylvaing@microsoft.com>, Tab Atkins Jr. <jackalmage@gmail.com>
CC: "L. David Baron" <dbaron@dbaron.org>, fantasai <fantasai@inkedblade.net>, www-style list <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D170EB1F971@TK5EX14MBXC264.redmond.corp.microsoft.com>
http://dev.w3.org/csswg/css3-values/#calc

[1]# It can be used wherever <length>, <frequency>, <angle>, <time>, or <number> values are allowed.
[2]# A math expression has a resolved type, which is one of ‘<length>’, ‘<frequency>’, ‘<angle>’, ‘<time>’, or ‘<number>’.
[3]# The resolved type must be valid for where the expression is placed; otherwise, the expression is invalid.

[4]
http://www.w3.org/TR/css3-background/#the-background-position

<bg-position> = [
  [ top | bottom ]
|
  [ <percentage> | <length> | left | center | right ]  [ <percentage> | <length> | top | center | bottom ]?
|
  [ center | [ left | right ] [ <percentage> | <length> ]? ] &&  [ center | [ top | bottom ] [ <percentage> | <length> ]? ]
]


From [1], calc() cannot be used in place of <percentage> in a grammar.
From [2] and [3], when used in place of <length> the calc expression is either invalid or must resolve to a <length>.


DIV { width: 200px; height: 400px; font-size: 20px; }

Example A
Background-position: calc(5%);
=> background-position: 10px;

Example B
Background-position: calc(5%) bottom;
=> background-position: 10px bottom;

Example C
Background-position: calc(5%) calc(10%);
=> background-position: 10px 40px;

Example D
Background-position: calc(5% + 1em);
=> background-position: calc(5% + 20px);
=> background-position: 30px;


The rules for calc in Values (1,2,3 above) make it pretty clear it has to resolve to a <length>.

The fact that "background-position: 10%;" and "background-position: calc(10%);" can result in differ renderings is perhaps unfortunate, but required by the specs as I read them.
Received on Tuesday, 24 January 2012 18:20:54 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:48 GMT