Item-note spilling under icon on the right


#1

Have a list. I just have a long entry which I was hoping would go “…” or at least stop before the icon on the right. But the text is going under the icon. Can you please advise?

Here is the code:

<ion-list>           
        <ion-item class="item-input item-icon-right">
            <span class="input-label">Name(s)</span>
            <span class="item-note">{{observation.Names.toString()}}</span>
            <i class="icon ion-plus-circled"></i> 
        </ion-item> 
</ion-list>

And a screen shot: