Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP


Expressions with nested parentheses #1030

stickyerik opened this Issue · 4 comments

4 participants

stickyerik Andrey Mikhaylov (lolmaus) Natalie Weizenbaum Chris Eppstein

When working with retina-sized graphics and design PSD's, I often want to keep measurements in actual pixels and divide by two. This is neat, but in situations where I want an expression first, then do the division (such as subtracting padding from a height), I get a "nested" expression that doesn't seem to be supported. For example:

height: ((100px-22px)/2);


height: 100px -22px/2;

where I would expect:

height: 39px;

There might be some syntax-related reason why this can't be implemented, I just haven't though of any yet. And I'm sure I could use variables, mix-ins or something else to achieve the same thing, it just seems to me that this should work as well.

Otherwise, this being my first issue post: Yay for Sass!

Andrey Mikhaylov (lolmaus)

A hyphen in Sass can be part of variable name, so... H2O: Just Add Water!

height: ((100px - 22px) / 2);
Natalie Weizenbaum

This isn't actually caused by the hyphen being consumed as part of an identifier, nor does it have anything to do with nested parentheses. It's caused by the space operator plus the unary - operator having higher precedence than the binary minus.

I think this is misleading enough that it's worth fixing. My instinct is that it's unlikely that anyone is relying on this behavior; browsers don't seem to consider 10px-20px to be a valid substitute for 10px -20px. I'm fine with fixing this without a deprecation period. @chriseppstein, what do you think?

Chris Eppstein

Well, I was perfectly satisfied with the first answer, although I haven't had time to test it yet. Silly of me not to try adding the whitespace myself. I guess I'm just not used to hyphens being valid characters in variable names and such, but it does make sense in the CSS context.

If there is a slight risk of anyone or anything expecting 10px-20px to be the same as 10px -20px, maybe you could go the same way as with the division operator, to have it interpreted as such only if it is part of an expression or enclosed in parentheses? Just an idea - I'm sure you'll see and do what's best.

Anyway, I'm glad this resulted into something that you considered worth fixing!

Natalie Weizenbaum nex3 closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.