CSS内で引き算や足し算ができる便利なタグcalc。ヘッダーの高さ分だけ引いて・・・なんてことが出来ます！

CSS内で引き算や足し算ができる便利なタグcalcです。

height: calc(100vh - 50px);

こんな感じで使います。

ブラウザの画面サイズの高さいっぱいにコンテンツを表示したかったのです。
（使う人のモニタに合わせたり、ブラウザのサイズを変更しても高さを自動で調整する）

高さを100vh（高さ100%って意味）で設定したのですが、ヘッダーを固定にしていたため、ヘッダーの高さ分、余計な縦スクロールが出てしまいました。

そこで100vhからヘッダーの50pxを引き算したいな、と調べたらcalc（）がありました。

これは便利ですが、IE8以下は未対応みたいです。