CSS Calc（）函数不适用于SASS文件

Question

问题：

• 正确使用sass文件中的calc函数。

案例：

.class1  {
      max-width: calc(100% - #{$endWidth});
      min-width: $startWidth;
      text-overflow: ellipsis;
    }

.class2 {
      max-width: calc(100% - #{$startWidth});
      direction: rtl;
    }

已尝试的情况：

• 我已经验证了堆栈溢出中的几个答案，并且其中一个问题答案启发了我的问题-Stack Overflow Reference。这些解决方案不适用于我的情况，

• 我应该在sass中使用mixin使其正常工作吗？

Answer 1

虽然 calc() 确实确实会导致SASS文件出现问题，但可以通过使用插值（您正确使用的插值）来避免这种情况。

您问题的唯一可能说明是：

• 您没有（或定义不正确） SASS variables： $startWidth和$endWidth
• 带有 higher specificity 的规则将覆盖您的选择器
• 您已经缓存了旧样式，因此请使用 CTRL + SHIFT + R
清除缓存

Here's an example JSFiddle 展示了上面的代码。