角度编译.less正在将像素计算为百分比：“ calc（100％-26px）”到“ calc（76％）

Question

我在.less文件中具有以下css声明：

.qb-select-content {
    width: calc(100% - 26px);
    float: left;
}

当我编译此代码时，angular-cli将width: calc(100% - 26px);转换为width: calc(76%)。

任何人都可以解释为什么会发生这种情况，以及如何防止这种行为发生？

Answer 1

您可以转储声明（注意~波浪号）：

.qb-select-content {
    width: calc(~100% - 26px);
}

以上内容将在编译后输出：

.qb-select-content {
    width: calc(100% - 26px);
}

请记住，这不是angular-cli而是您的LESS编译器进行的

或者，您也可以研究插值，这在其他情况下也是非常有用的功能：https://github.com/SomMeri/less4j/wiki/Less-Language-String-Interpolation