見出し画像

SCSSで割り算をやる時、結局calc()で済ませちゃうのやつ

 @importとの別れと共に、割り算のやり方も変更しないと~という事で、割り算だけやり方変えるのだるいな…と思っていたのですが、calc()使えばいいだけやん、というお話。

 例えば、100%表示のボックスを2分割して、分けたボックスの間は確実に20pxあけたい、という時。

calc((100% - 20px) / 2)

 ↑のような式をmath.div使ってやるの、めっちゃ面倒じゃない?となりました。(正直、どうやればmath.div使ってできるんだ…数値を代入とかすればできるかもだけど、結構面倒だよね…)

 調べてみても、SCSSでcalc()使うなとは書かれていないし。しいて言えば、calc()使わなくても計算式書けるのに、結局使うんかい!っていうくらい。

 ゴリゴリのフロントエンドなコーディングなら、calc()で十分だなとなりました。calc()内ならスラッシュ使ってもコンパイルエラーにならないしね。

この記事が気に入ったらサポートをしてみませんか?