ちょろい内容ですがいっつも書き方忘れるのでメモ。
calc()内でscssの変数表記を行っても、変数展開されないのでその時のTips
// 両端にmarginで余白を取り、widthはそれを引いた値にしたい
// NG
$margin-width: 20px;
.sample {
width: calc(100% - $margin-width * 2); // この書き方ではだめ
margin: 0 $margin-width;
}
// OK
$margin-width: 20px;
.sample {
width: calc(100% - #{$margin-width} * 2); // #{}で囲む
margin: 0 $margin-width;
}
地味に困ってる方いるんじゃないでしょうか。。。