我正在 React 创建一个聊天机器人应用程序。它在其他浏览器上工作正常,但在 Safari 上,每当虚拟键盘打开时,它都会导致整个主体变得可拖动,滚动条延伸到主体下方,并且主体下方和键盘上方出现黑色空间。
这是截图:

这是我的 App.css 的样子:
body {
overflow: auto;
height: 100%;
min-height: 100%;
overscroll-behavior: none;
}
html {
overflow: hidden;
height: 100%;
}
Run Code Online (Sandbox Code Playgroud)
我尝试过设置
height: 100vh;
min-height: 100vh;
Run Code Online (Sandbox Code Playgroud)
在html和body标签上,但它没有做任何事情。如果我戴上overflow: hidden它body,就会弄乱内部容器滚动条,就像我在某处看到推荐的那样使用position: fixed它时,就会弄乱内部容器滚动条。body是否有一个纯 CSS 解决方案,或者我错过了一些明显的东西?提前致谢。