Problem with removed parenthesis from calc before var

[shrpne]

Original issue cssnano/cssnano#645

This valid css

--aspect-ratio: 16/9;
padding-top: calc(100% / (var(--aspect-ratio)));

becomes invalid after cssnano compilation, because cssnano removes parenthesis around of var()

Chrome and Firefox don't respect the var() without parenthesis around it and so the code is not working as expected.

Test case: https://jsfiddle.net/z7bsn1r8/4/

[Semigradsky]

Is it the browser bug? Why parenthesis needed around of var()?

[shrpne]

I believe it's not a browser bug. Parenthesis are needed because of math:
100 / (16/9) = 56.25
100 / 16/9 = 0.69

[coreyworrell]

Probably related #115

[dangelion]

Any news on this huge bug, it's very blocking...

[ludofischer]

It's harder to fix than it seems, because the current parser does not distinguish:

100% / (var(--aspect-ratio))

from

100% / var(--aspect-ratio)