ion-libel positon="floating" is not working with ion-input placeholder

Question

Label isn't moving when input will be focus. If input hasn't placeholder it works fine but in my case it has a placeholder. How can I fix it?

<ion-item>
 <ion-label position="floating" >{{ 'enterPhoneNumber' | translate}}</ion-label>
 <ion-input placeholder="Phone" name="phone" type="text" required ></ion-input>
</ion-item>

Answer 1

The placeholder text has to go with the ion-label tags... Please refer the official docs.

    <ion-item>
      <ion-label position="floating"> Phone </ion-label>
      <ion-input required [(ngModel)]="enterPhoneNumber" type="text"></ion-input>
    </ion-item>