Re: [css-variables] Is making a property negative via `-var(--width)` valid syntax?

On Sun, Nov 8, 2015 at 3:11 PM, François REMY <francois.remy.dev@outlook.com
> wrote:

> > De : Xidorn Quan [mailto:quanxunzhen@gmail.com]
> > On Mon, Nov 9, 2015 at 8:37 AM, Boris Zbarsky <bzbarsky@mit.edu> wrote:
> > > On 11/8/15 1:51 PM, Philip Walton wrote:
> > >>
> > >> If I try doing the same thing with custom properties in Firefox is
> > >> fails. I'm assuming that's a bug, but I wanted to ask here to make
> sure.
> > >
> > >
> > > The Firefox behavior seems correct to me per spec at first glance,
> > > though the spec could be clearer about this for sure.  The issue
> > > you're running into is var() substitutes a sequence of tokens, not a
> > > string to be retokenized.  This is the part that could be spelled out
> more
> > clearly.
> > >
> > >> .parent {
> > >>    --gutter: 1em;
> > >>    margin: -var(--gutter); /* declaration ignored in FF */
> > >
> > >
> > > So the value of the custom property in this case is the sequence of
> > > tokens [1em].
> > >
> > > The value of 'margin' is then the sequence of tokens ['-', 1em] which
> > > is not the same thing as the single token [-1em].
>
> This is right. "CSS Variables" are some form of "Token Stream Reference"
> as I call them in the sense that they replace tokens, not chars. As a
> matter of fact, you can pretty much insert /**/ before and after the
> var(...) declaration to see how it would be interpreted.
>
>     padding: -/**/1em;
>
> doesn’t work, so doesn't
>
>     padding: -/**/var(...);
>
>
Hmmm, I see. That makes sense, though I kind of fear the backlash when
people used to preprocessors discover they can't do that.

I suppose they could also do something like the following if they found
themselves needing to use the inverse version frequently:

{
  --inverse-gutter: calc(-1 * var(--gutter));
}

Perhaps that's more explicit anyway.