I’m developing a messaging feature where we need the message input box to be sticky at the bottom of the screen with the content scrolling behind it. However when clicking in the input box on iOS, the keyboard covers the input box. On Android the content resizes correctly to show the input box above the keyboard. The structure looks something like this:
<ion-view> <ion-content> </ion-content> <div> <textarea></textarea> </div> </ion-view>
I’ve tried placing the
textarea inside the
position: fixed or
position: absolute causes the textarea to show up at the top of the content instead of at the bottom and doesn’t float over the content like I need it to.