Safari Mobile 键盘顶部出现空格问题

Question

我在 Safari 移动版上遇到问题，在关注输入元素并打开键盘后，键盘顶部添加了一条白色 space。

它也破坏了我的应用程序的样式，因为 'height: 100%' 不再有效，并且在键盘关闭后元素无法重新适应以填充设备的整个高度。

Answer 1

解决此问题的方法是确保所有父容器的高度为 100%（包括 html、body 等），然后确保可滚动容器/包装的最后一个元素整个页面有以下样式：

position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-overflow-scrolling: touch;

确保这些样式仅应用于移动视口，因为它可能会影响您的桌面样式。