Hiding ion-footer when keyboard appears


#1

Hello guys,

When i click on a input-field and my keyboard appears on my page, the footer (ion-footer) is over the keyboard - this looks not very good.

Can anyone say me how to put the footer fixed to the bottom?


#2

I have the same problem! My structure is

<ion-header>
  <ion-navbar>
    <ion-title>test</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
  <form>
    <ion-list>
      <ion-item class="item-style">
        <ion-label class="label-style" stacked>Email</ion-label>
        <ion-input type="email"></ion-input>
      </ion-item>
      <ion-item class="item-style">
        <ion-label class="label-style" stacked>Password</ion-label>
        <ion-input type="password"></ion-input>
      </ion-item>
  <button ion-button type="submit" outline>Submit</button>
    </ion-list>
  </form>
</ion-content>
<ion-footer no-border>
  <ion-label class="sign-in">Hello Footer</ion-label>
</ion-footer>

My ionic configuration is:

ionic info

global packages:

@ionic/cli-utils : 1.5.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.5.0

local packages:

@ionic/app-scripts              : 1.3.12
@ionic/cli-plugin-cordova       : 1.4.1
@ionic/cli-plugin-ionic-angular : 1.3.2
Cordova Platforms               : android 6.2.3
Ionic Framework                 : ionic-angular 3.5.0

System:

Node       : v8.0.0
OS         : Linux 4.4
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed
npm        : 5.0.3

#3

Conseguiu resolver ?