HTML / SASS元素的属性值无效

Question

我的元素高度具有无效的属性值，我不知道为什么。
这是我的SASS代码：

.iconDiv {
    $iconDivSize: 200px;
    .icon {
        $iconDeltaHeight: calc(#{$iconDivSize} / 60.8);
        $iconHeight: calc(#{$iconDeltaHeight} * #{$iconDivSize});
        height: $iconHeight;
    }
}

我的输出元素高度为calc(calc(200px / 60.8) * 200px)，但是无效...为什么？

Answer 1

两个问题，您不能嵌套calc，并且只能有一个单位声明。

您需要类似的东西

$iconDivSize: 200;
.iconDiv {    
    .icon {        
        height: calc(#{$iconDivSize}px / 60.8 * #{$iconDivSize});
    }
}

Demo