How to use grid layout with a fixed height for rows and make it works even when the keyboard opens?

I've used the Grid layout in Ionic to build a page divided into 3 rows. The middle one is 60% of the entire grid height, while the first one and the last one are 20% both. And it works.
The problem is that when I insert some text and the keyboard opens, the layout becomes broken. How can I fix it?

Layout when the keyboard is closed

Layout when the keyboard is open
You can see that in this case that the layout occupies only a minimum part in the top of the screen

page-example {
ion-grid {
height: 100%;
}
ion-row {
height: 60%;
}
ion-grid ion-row:first-child,
ion-grid ion-row:last-child {
height: 20%;
}
}

<ion-content>

<ion-grid>

<ion-row style="background-color: #ff00ff;">
<ion-col>
<ion-label class="label1" text-right>Label 1</ion-label>
</ion-col>
</ion-row>

<ion-row justify-content-center style="background-color: #00ffff;">
<ion-col col-10>
<ion-list>
<ion-label class="title" text-center text-wrap>Title</ion-label>
<ion-item>
<ion-label stacked>Insert text here to bug the layout</ion-label>
<ion-input type="text" placeholder="text"></ion-input>
</ion-item>

<ion-item>
<ion-label stacked>Option 1</ion-label>
<ion-select>
<ion-option [selected]="true" value="1">1</ion-option>
<ion-option value="2">2</ion-option>
<ion-option value="3">3</ion-option>
</ion-select>
</ion-item>

<ion-item>
<ion-label stacked>Option 2</ion-label>
<ion-select>
<ion-option [selected]="true" value="4">4</ion-option>
<ion-option value="5">5</ion-option>
</ion-select>
</ion-item>

<ion-item>
<ion-label stacked>Option 3</ion-label>
<ion-select>
<ion-option [selected]="true" value="6">6</ion-option>
<ion-option value="7">7</ion-option>
</ion-select>
</ion-item>
</ion-list>
</ion-col>
</ion-row>

<ion-row style="background-color: #ffff00;" justify-content-center align-items-center>
<button ion-button>Button</button>
</ion-row>

</ion-grid>

</ion-content>

Thanks in advance!

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.