CSS calc（）函数在Chrome中不起作用

Question

我想在列中设置特定的宽度，但是calc函数不起作用。它显示了Chrome开发人员工具中的错误。

代码：

.row {
  max-width: $grid-width;
  background-color: #eee;
  margin: 0 auto;

  &:not(:last-child) {
    margin-bottom: $gutter-vertical;
  }

  @include clearfix;

  [class^= "col-"] {
    background-color: orangered;
    float: left;

    &:not(:last-child) {
      margin-right: $gutter-horizontal;
    }
  }

  .col-1-of-2 {
    width: clac((100% - #{$gutter-horizontal}) / 2);
  }

  .col-1-of-3 {
    width: clac((100% - 2 * #{$gutter-horizontal}) / 3);
  }
} 

Answer 1

您在评论中发布的代码具有clac（）而不是calc（）

{ width: clac((100% - 2 * #{$gutter-horizontal}) / 3); } } 

Answer 2

calc的拼写错误是错误的，它是您代码中的clac