Display Info Icon Inline In Ion-item

I want to display ionic info icon at the end of my input box. However, the following snippet shows only input box, not the icon: <

Solution 1:

ion-item sets the content in a single row. You were missing an attribute item-end on the button. I would also recommend adding icon-only in order to get the full button as the specified icon.

Code:

<ion-contentpadding><formnovalidateoffset-lg-3offset-xl-4col-lg-6col-xl-4><ion-listinset><p>Forget password</p><ion-item><ion-inputplaceholder="Email or Phone"name="email"></ion-input><buttonion-buttonclearitem-endicon-only><!-- here --><ion-iconname="ios-information-circle-outline" ></ion-icon></button></ion-item></ion-list><buttonion-buttonroundfulltype="submit">Submit</button></form></ion-content>

demo

Solution 2:

<ion-item><ion-inputplaceholder="Email or Phone"name="email"></ion-input><buttonion-buttonclearitem-endicon-only><ion-iconname="ios-information-circle-outline" ></ion-icon></button></ion-item>

You have to use ion-icon inside ion-label