我有一頁網頁放在 PC responsive 看是好的，模擬成 iPhone / iPad 也都順利，就是實際拿 iPhone / iPad 來看後，會被 address bar 卡住。原先只想到設成 100vh 以為就能拿到最大的可視高度了，結果只要 Safari 橫向而且開多個分頁後，我的網頁高度就出事了。
後來查到這一篇： Designing websites keeping floating tab bar of Safari 15 (on iOS) in mind. 最後我在網頁底預留了
padding-bottom: env(safe-area-inset-bottom);
留給 address bar, 看似高度問題解決，iPhone / iPad 的 Safari 上能順利顯示了。因為怕有人將 address bar 移到上方，所以我也加了
padding-top: env(safe-area-inset-top);
希望能順利。
0 comments:
張貼留言