ionic2 - Vertical and horizontal center of avatar image after resizing -

i have following code display small avatars:

<ion-avatar *ngfor="let user of item.users;">   <img src="{{ user.avatar }}" style="max-width:2.5rem; max-height:2.5rem;"> </ion-avatar> 

as seems, default size of ion-avatar 4rem on 4rem . result avatars aligned top left corner of bigger container (which fine me - spacing between avatars).

how can make image in center of ion-avater continer?

you need set margin: auto; in *.scss

in *.component.ts

<ion-avatar class='avatar' *ngfor="let user of item.users;">   <img src="{{ user.avatar }}" style="max-width:2.5rem; max-height:2.5rem;"> </ion-avatar> 

in *.component.scss

.avatar img {   margin: auto; }