Chrome на iPad: тело отображается под фиксированной нижней панелью после закрытия виртуальной клавиатуры ⇐ CSS

[Anonymous]

Я создаю полноэкранную панель инструментов с панелью инструментов, которая должна оставаться внизу.
В Chrome (который использует WebKit) на iPad, когда я закрываю виртуальную клавиатуру, можно прокрутить вниз и увидеть цвет фона тела под фиксированным элементом div, расположенным на расстоянии -20 пикселей снизу. После закрытия виртуальной клавиатуры кажется, что страница теперь имеет высоту более 100%, поскольку я могу прокручивать ее так далеко...
Вот скриншот поведения:


Такого поведения не происходит Safari.
Можно ли каким-либо образом предотвратить такое поведение и при этом позволить тексту автоматически отображаться прямо над виртуальной клавиатурой, когда она открыта?

Код: Выделить всё

html {
overflow-y: scroll;
overscroll-behavior: none;
}

body {
background-color: darkgray;
margin: 0px;
padding: 0px;
width: 100%;
}

#contentDIV {
background-color: white;
margin-top: 400px;
}

#editableDIV {
margin-top: 400px;
}

#bottomBarDIV {
background-color: aqua;
bottom: -20px;
padding: 0px 5px 0px 5px;
height: 73px;
position: fixed;
width: 100%;
padding-bottom: env(safe-area-inset-bottom);
}

Код: Выделить всё

Document




This text is editable.

This is the bottom bar.

Подробнее здесь: https://stackoverflow.com/questions/798 ... eyboard-is