How to change the avatar alignment left to center

Ionic Framework ionic-v3
1

How to change the avatar alignment left to center
below my html code

<ion-card>
  <ion-item style="text-align: center">
  	<div style="text-align: center">
    <ion-avatar>
      <img src="http://m.blog.hu/fo/fotovideo/image/foto-bevezeto.jpg" style="text-align: center">
    </ion-avatar>
  </div>
    <p>November 5, 1955</p>
    <p>November 5, 1955</p>
  </ion-item>
</ion-card>

Screen%20Shot
i want to change the left alignment to center . like my red round
how can i do that
please help me out
Thanks

2

To center an image:

<ion-content>

  <ion-card>

    <ion-card-content>

      <ion-thumbnail>
        <img src="{{'assets/data/labels/' + beer.label}}">
      </ion-thumbnail>

      <ion-card-title text-center>
        <strong>{{beer.name}}</strong>
        <p>{{beer.style}}</p>

        ...

      </ion-card-title>

      <p>{{beer.description}}</p>

      </ion-row>

        ...

      </ion-row>

    </ion-card-content>

  </ion-card>

  ...

</ion-content>

For example:

59
Screen Shot 2018-05-28 at 08.19.59.png367×650 86.8 KB

1 Like
3

Hey @flycoders_sourav, use this code. Hope it’ll solve your problem:

<ion-card>
  <ion-item style="text-align: center">
  	<div align="center">  //this line has been changed
    <ion-avatar>
      <img src="http://m.blog.hu/fo/fotovideo/image/foto-bevezeto.jpg" style="text-align: center">
    </ion-avatar>
  </div>
    <p>November 5, 1955</p>
    <p>November 5, 1955</p>
  </ion-item>
</ion-card>
1 Like