使用较少，CSS3 calc()无法正常工作 [英] Using Less, CSS3 calc() doesn't work correctly

问题描述

当我直接在Chrome和Firefox的Inspector中使用此 calc(100％+ 20px)时，它可以正常工作，如图所示.

When I use this calc(100% + 20px) directly in Chromes and Firefox' Inspector it works fine and as shown.

但是，当我将其插入我的less文件中时，它会转换为 120％.我在做什么错了?

However when I insert it into my less file it gets converted to 120%. What am I doing wrong?

推荐答案

较少将尝试处理所有数学，包括 100％+ 20px .

Less will try to process all maths including 100% + 20px.

您可以在严格数学"上设置:

lessc -sm=on
lessc --strict-math=on

或使用 波浪号 〜"100％+ 20px" ，以防止该语句被Less处理.

Or use a tilde-quote ~"100% + 20px" in order to prevent the statement from being processed by Less.

例如:

.class {
    padding-left: calc(~"100% + 20px");
}

这篇关于使用较少，CSS3 calc()无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！