css - CSS3 中 calc 操作数的 LESS 转义中的空白保留

Question

我想用 LESS 表达以下 CSS:

.a {
    min-height: calc(2em + 4px);
}

因此，为了防止 LESS 尝试计算，我使用 LESS escaping syntax 编写了表达式:

.a {
    min-height: ~'calc(2em + 4px)';
}

但是，LESS 的缩小引擎正在删除空格，并发出:

.a{min-height:calc(2em+4px);}

这是有问题的，因为 webkit 无法正确计算 2em+4px，而 2em_+_4px 工作正常(为清楚起见添加下划线。)似乎真正的错误在这里在 webkit 中，因为我希望 CSS3 calc 的语法允许标记之间没有空格。

Answer 1

这是一篇旧帖子，但我想向您展示一个简单的数学解决方法。

我的缩小引擎也有这个问题。我的减法工作正常，但另外删除空格。如果有人遇到同样的问题，这是最简单的解决方法。

如果你想要这个:

.a {
    min-height: ~'calc(2em + 4px)';
}

改为这样写:

.a {
    min-height: ~'calc(2em - -4px)';
}