チャットボット画像の表示位置を、iPhoneのセーフエリアにかぶらないようにする

[saladdays]

改善詳細 / Details of Improvement

• iPhone X / 11 などのホームボタンがないiPhoneでの表示時に、チャットボットの画像がセーフエリアに入っていしまいホームインジケーターにかぶってしまっている

スクリーンショット / Screenshot

期待する見せ方・挙動 / Expected behavior

• セーフエリアを避けて配置する
• safe-area-inset-bottom を追加すればセーフエリアの高さをよしなに挿入してくれると思います

ex)

#chat_banner {
  bottom: calc(10px + constant(safe-area-inset-bottom)); // iOS 11.1以前用
  bottom: calc(10px + env(safe-area-inset-bottom)); // iOS 11.2以降用
}

動作環境・ブラウザ / Environment

• iOS Safari （13.5にて確認）

[saladdays]

このposition指定がチャットボット側のコードで生成されている場合は対応が難しいかもしれません

[kaizumaki]

@saladdays さん、ご提案ありがとうございます！チャットボットのご提案については #5455 に書いているのですが、担当課がありまして、そこからベンダーさんに連絡がいくようになっています。
みたところ、ベンダーさんのスクリプトからstyleが読み込まれているようなので、 @saladdays さんのご提案も担当課にご連絡いただくほうが早いと思います 🙇‍♀️

[kaizumaki]

こちらはいったんクローズさせていただきますね。