宮野 比伊呂
Safariでclamp()が効かない場合の対処法
前回、CSSの比較関数（min・max・clamp）についてご紹介しました。
主要ブラウザには対応していていても、clamp()は Safari で効かない場合があるようです。
比較関数に関する記事はこちら
【サンプルあり】今すぐ使える！便利な比較関数 min() max() clamp() のお話
設定前は、Safariのウィンドウ幅を狭めてもclamp関数で最大値に指定している値から変化がありませんでしたが、以下のコードを入れるだけで指定通り動くようになりました。
* {
min-height: 0vw;
}clamp関数を使う場合は合わせて設定しておくと良いかと思います。
MIYANO SATOMI Front-end Engineer / 宮野 聡美
Our Signature Products, Born from Insight.
提案から生まれた、
MARBLEの代表プロダクト
お客様の課題を起点に、MARBLEが自ら構想し、
仕組みからデザイン、開発、運用まで一貫してつくり上げたプロダクト群です。
業務改善、運営効率化、新たな顧客体験の創出など、
企業の事業成長に直結する“実装された解決策”を形にしています。
-
01 入退場システム
Entry System
全国15店舗、会員数50万人以上のこども向けパークで稼働する入退場・決済・顧客管理システム。
受付の効率化と回転率の向上を実現し、運営データの一元管理を可能にしています。 -
02 自動配送システム
Delivery Routing
50台のトラック、年間350日の配送を最適化する自動ルート生成システム。
紙のFAXで届く約500件の配送情報をデジタル化し、最適ルートを自動で算出することで、大幅な業務効率化を実現しました。 -
03 会話型コマース連携
Auto Routing
ライブチャットでの接客からEC購入までを一つの導線でつなぐ会話型コマースシステム。
リアルタイムの対話で顧客の購買意欲を高め、高いコンバージョン率につながる仕組みを構築しています。