First of all, I wanted to say that I am new and I don’t know if this topic goes here. In that case, have the corresponding administrator move it, please
According to my console, I am using version 5.2.3 of Ionic (if you need any more information, ask me for it), and I encounter the following problem:
When I find myself developing the app, using the Chrome inspector, everything works without problem. Also, even when I build the Android APK and test it on my Xiaomi Redmi Note 7, everything works fine. Here is a screenshot:
But as soon as I activate the keyboard, all the elements of the screen get messy (except the tabs buttons, which are kept underneath I guess):
I’ve been looking for solutions, but I can’t find anything to solve this.
Has something similar happened to someone else? Or am I the only one?
Here is the HTML code:
<ion-content>
<ion-grid style="height: 100%">
<ion-row justify-content-center align-items-center style="height: 100%; flex-direction: column">
<div class="imagenPublicar">
<img src="assets/icons/camara.svg"/>
</div>
<ion-chip class="inputPublicar">
<ion-input class="ion-text-center" placeholder="Nombre del restaurante"></ion-input>
</ion-chip>
<ion-chip class="inputPublicar">
<ion-input class="ion-text-center" placeholder="Precio del menú"></ion-input>
</ion-chip>
<ion-chip class="ubicacionPublicar">
<ion-icon name="pin"></ion-icon>
<ion-label>¿Dónde está?</ion-label>
</ion-chip>
<ion-chip class="hechoPublicar">
<ion-label>¡Hecho!</ion-label>
</ion-chip>
</ion-row>
</ion-grid>
</ion-content>
Thank you very much to all!