Vertical and horizontal center of avatar image after resizing

Ionic Framework ionic-v3
1

I have the following code that 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 it seems, the default size of ion-avatar is 4rem on 4rem .
The result is that the avatars are aligned to the top left corner of a bigger container (which is fine for me - spacing between the avatars).

How can I make the image to be in the center of the ion-avater continer?

2

One super dirty way would then probably be to add margin-left and margin-top to your of 0.75rem.

3

FMTEYEWTK on centering things in CSS.