Ionic2 ion-avatar vertical alignment

Ionic Framework ionic-v3
1

Hi All,

This is my first Ionic2 app and the alignment issue is there in a list. I’m not sure how to post the whole code as when I paste the code it is not getting displayed as it is.

The avatar in a list is not getting displayed in center (vertical) alignment in iOS when “button ion-item” tag is used instead of “ion-item”. The avatar image is getting displayed at top.

<button ion-item>
  <ion-avatar item-left>
    <img src="https://randomuser.me/api/portraits/thumb/lego/1.jpg">
  </ion-avatar>
  <h2>Finn</h2>
  <h3>I'm a big deal</h3>
  <p>Listen, I've had a pretty messed up day...</p>
</button>

I am trying to use button to goto next detail page and also going to add sliding options. Alignment issue is not there when button is not used. Is there any workarounds for this issue?

Very much appreciate your help on this.

Thanks,
Annadurai.

2

I’ve resolved the issue by using <a ion-item tag instead of button. Hence, closing this thread. Thanks.