How to fix Ionic floating label with border input

I need to make (ion-label floating) same like below screenshot in my ionic4 project.
please advice me.

Here is the link what i am looking
This is my current code

    <ion-label position="floating">Floating Label</ion-label>
    <ion-input formControlName="password" id="password" type="password"></ion-input>

Looking same as it is.

You can get the input is on/out focus by this code.

<ion-input (ionBlur)="inputBlur()" (ionFocus)="inputFocus()"></ion-input>

Getting this error.

You need to have those functions defined in your component code.

1 Like

can you give me a example

@yeshwanthmn Hey any update on this? Looking for the same design! anything will help :slight_smile: