My less file contains the following calculation:
height: calc((100vh - 60px) + ((100vw / 9) * 3));
However, the result is not what I expected. According to my chrome devtools, the result is:
height: calc(73.33333333vh);
In my viewport, it should be around 130vh, which is way off.
I have tried to rectify this issue but was unable to find a solution. Due to the complex nature of the value, I couldn't find similar cases to reference. The following calculations were attempted, but they all produced faulty results:
height: calc((~"100vh - 60px") + ((~"100vw / 9") * 3)); // doesn't compile CSS
height: ~"calc((100vh - 60px) + ((100vw / 9) * 3))"; // results in invalid height value
If anyone has any insights into what might be going wrong, your help would be greatly appreciated.