Keyboard issues with ionic3


#1

Hi All,
I am experiences a problem with keyboard. I have a page with a list containing 5 input fields. When the keyboard shows the page pushes up and when the keyboard hides the page position remains the same. When I inspect it, shows that there is a padding-bottom:300px present even after the keyboard hides.
Is there any solution for the same? Please find the html code below

<ion-content padding #content>
    <img src="assets/imgs/ic_tutorial_three.png" style="height:150px;width:150px">
    <ion-card>
      <ion-item>
          <ion-avatar item-end class="margin-bottom-none" *ngIf="validCurrentKey">
              <img src="assets/imgs/ic_tick.png" class="tick-button">
            </ion-avatar>
        <ion-label color="primary" stacked>Your Current PIN</ion-label>
        <ion-input type="password" placeholder="PIN" (ionChange)='checkCurrentPassword($event)'></ion-input>
      </ion-item>
      <ion-item >
        <ion-label color="primary" stacked>Enter Your New PIN</ion-label>
        <ion-input type="password" placeholder="PIN"  [(ngModel)]="newPin"></ion-input>
      </ion-item>
      <ion-item>
        <ion-label color="primary" stacked>RE-Enter Your New PIN</ion-label>
        <ion-input type="password" placeholder="PIN"  (ionChange)="validateNewPassword($event)"></ion-input>
      </ion-item>
    </ion-card>
    <div class="bottom-button"> 
        <button ion-button round full class="submit-button"  (click)="goBack()" >UPDATE PIN</button>
    </div>
  </ion-content>

Thanks and Regards
Anand Raj