Safariでclamp()が効かない場合の対処法
前回、CSSの比較関数(min・max・clamp)についてご紹介しました。
主要ブラウザには対応していていても、clamp()
は Safari で効かない場合があるようです。
比較関数に関する記事はこちら
【サンプルあり】今すぐ使える!便利な比較関数 min() max() clamp() のお話
設定前は、Safariのウィンドウ幅を狭めてもclamp関数で最大値に指定している値から変化がありませんでしたが、以下のコードを入れるだけで指定通り動くようになりました。
* {
min-height: 0vw;
}
clamp関数を使う場合は合わせて設定しておくと良いかと思います。