Re: [css-variables] Using $foo as the syntax for variables

On May 22, 2012, at 1:24 AM, "Florian Rivoal" <> wrote:

> On Mon, 21 May 2012 23:30:34 +0200, Tab Atkins Jr. <>
>> Right now, the Variables draft makes variable names be simple idents,
>> and uses the var() function to reference them.  This was *one* option
>> for using variables, which I chose on the hope that it would make it
>> easier for the group to accept the draft.
>> Another possibility is to use a $ glyph as a prefix.  This was
>> suggested by several people in the WG after I presented the current
>> Variables draft, and it matches the way SASS does variables.  Chris
>> Eppstein, one of the SASS devs, has been telling me repeatedly that
>> the $foo syntax will be easier for devs.
>> [...]
> I prefer the current var- syntax over $ for several reasons:
> 1)
> Because var-foo looks like regular property, its hint towards the
> fact that the behavior involves the cascade. $foo doesn't. It looks
> like SASS or perl or BASIC variables, which don't involve the
> cascade, and that will probably confuse authors.

Variables NEED to look different from properties because they are a new
primitive. That they adhere to the cascade is a natural behavior for CSS.
They will figure it out, they are smart.

> 2) It is less disruptive of the grammar

This is not a reason. It is a new primitive, changing the grammar makes
sense here. Please state why the grammar changing is bad.

> 3) While the various extensions proposed can be done as you said with
> a function on top of the $ syntax, it feels hacky to me. Expressing
> it based on the var() syntax seems much more natural.

I can't change the way you feel, but I will tell you that my experience
with thousands of devs and designers using Sass is that it feels natural
and consistent to them and they very much dislike the var() notation.

> 4) Because SASS variables and CSS variables behave differently,
> I can reasonably see authors wanting to use either, or
> even wanting to use both in the same style sheet. Using the same
> syntax is asking for trouble.

Only sass uses $ for variables, and we are committed to supporting this
change to CSS by changing Sass to accomodate. Please read my comments from
back in February on this subject:


Received on Tuesday, 22 May 2012 20:57:06 UTC