CSSのcalc()を使うときは演算子の前後にスペース入れる

投稿日: 更新日:

よくつまづくのでメモ。

表題の通り、CSSのcalc()は、演算子の前後にスペース入れないといけない。

width: calc(100% - 17em);
->OK

width: calc(100%-17em);
->NG

JSとかのプログラミング言語で計算式書いてる経験あると「CSSでも同じだろう」とか思うのでハマる。

MDNによると、「*」「/」は前後スペース不要だそうだが、これらの場合もスペース入れる事を推奨してる。

参考

calc() - CSS: カスケーディングスタイルシート | MDN (mozilla.org)

関連するタグ

関連するタグは現在ありません。