ios hides content on the bottom of the page

by mr_blond97

HTML

<div class="wrapper">
     <div class="content">It's scrolleble content</div>
     <div class="bottom_menu">Content on the bottom of the page</div>
</div>

CSS

.wrapper {
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: scroll;
}

.content {
  flex-grow: 1;
    justify-content: center;
    display: flex;
    align-items: center;
    background: green;
}

.bottom_menu {
  background: rebeccapurple;
  height: 44px;
  bottom: 0px;
}