How to fix Safari IOS 9 cross-browser overflow, 100vh issue?

Question

css

The essence of the problem: when you click on the "Open menu" button, the menu opens. But on Safari IOS, for some reason it is truncated from the bottom. I read that Safari IOS considers the height differently. But I still don’t understand how it is possible to make the menu in the overflow block not fit completely, i.e. to be like on chrome android. Ios
example link : Android:

Answer 1

Either JS or CSS like padding-top/bottom. Initially, vh / vw is the visible part of the screen, without taking into account any overlapping navigation bars (they had not yet been invented then).

Answer 2

Solved the problem like this:
html {
height: 100%;
}
.m-openSideMenu {
min-height: 100%;
}
.m-openSideMenu .inner,
.m-openSideMenu .sidebar,
.m-openSideMenu .sticky {
height: 100%;
}
I'll post an example later