富山のシステム開発・Web制作会社 株式会社MARBLE

https://marble-heroes.com/

We are creators
-create the next art

Safariでclamp()が効かない場合の対処法

前回、CSSの比較関数(min・max・clamp)についてご紹介しました。
主要ブラウザには対応していていても、clamp()は Safari で効かない場合があるようです。

比較関数に関する記事はこちら
【サンプルあり】今すぐ使える!便利な比較関数 min() max() clamp() のお話


設定前は、Safariのウィンドウ幅を狭めてもclamp関数で最大値に指定している値から変化がありませんでしたが、以下のコードを入れるだけで指定通り動くようになりました。

* {
    min-height: 0vw;
}

clamp関数を使う場合は合わせて設定しておくと良いかと思います。

宮野 聡美 Front-end Engineer

記事をもっと見る

記事をもっと見る

採用情報 Careers

私たちと一緒に働きませんか?

新しいことへの挑戦を心から楽しめるアナタをMARBLEでは募集しています。
実績がある方はもちろん、経験がない方も募集していますので、ぜひご応募ください。
必要なのは挑戦を楽しむ気持ちです。