At 3:09 AM -0500 9/6/07, Rafael wrote:
>Nick Fitzsimons wrote:
>>
>> Although "top 5%" is invalid, that's only because the horizontal position
>> must come first if one of the values is not a keyword; so "5% top" or "left
>> 23px" are valid. However, for clarity, I tend to use either just keywords or
>> just units, rather than mixing them together: "0 23px", for example.
>
> It seems it was invalid before, but not anymore(?).
Actually, Nick's right and the horizontal value has to come first
whenever you use lengths or percentages-- though understanding that
requires a detailed breakdown of the CSS 2.1 value syntax for
'background-position', which is a good deal more complicated than the
CSS2 syntax. Here's what the latest version of the specification
says (see
<http://www.w3.org/TR/2007/CR-CSS21-20070719/colors.html#propdef-background-position>):
Value: [ [ <percentage> | <length> | left | center | right ]
[ <percentage> | <length> | top | center | bottom ]? ] |
[ [ left | center | right ] || [ top | center | bottom ] ] |
inherit
Oy. So I cleaned it up a bit to read:
[
[ <percentage> | <length> | left | center | right ]
[ <percentage> | <length> | top | center | bottom ]?
] | [
[ left | center | right ]
||
[ top | center | bottom ]
] | inherit
Hopefully that makes it a bit clearer that we have three possible
forms for the value to take, and have to choose between them. The
last form is simply 'inherit', which is simple enough. The first
form is this:
[ <percentage> | <length> | left | center | right ]
[ <percentage> | <length> | top | center | bottom ]?
The first line says "you can use a percentage, a length, or any of
the three listed keywords". Again, you have to choose one of those.
Then, the second line says "you can OPTIONALLY (that's what the
appended '?' means) have a percentage, a length, or any of the three
listed keywords".
The key part here is that because there's no symbol between these
two lines, the value parts have to be in that order. In other words,
in this form, you can't put the vertical value first, no matter what.
The horizontal has to come first. And in the description of this
value form, the spec says that if you omit the vertical part of the
value-- remember, it's optional-- then it's "assumed to be 'center'".
Remember, though, that's just one of the two non-'inherit' value
forms we're permitted. The second form is:
[ left | center | right ]
||
[ top | center | bottom ]
In this form, you can choose one keyword from each list of three,
plus you can put the two words in any order AND you only have to pick
one of the two (all that is what the '||' between the lines means).
So you can validly say '5% top', but not 'top 5%'. For that
matter, you can say '0 top' but not 'top 0', even though the
functionally equivalent 'top left' is perfectly fine.
Bonus fun fact: as with an omitted vertical value in the first
value form discussed, if you only use one keyword in the second form,
the missing one is assumed to be 'center'. So 'top' is equivalent to
'top center' (and 'center top'), and 'left' is equivalent to 'left
center' (and 'center left').
--
Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone
"CSS is much too interesting and elegant to be not taken seriously."
-- Martina Kosloff (http://mako4css.com/)
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
