Align a ion-list whit *ngFor

Hello people… how can a align a ionList that have a *ngFor of ion-cards ?
align vertically in the center

i try this… and all the variations that i could think of:

    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    justify-items: center;
    vertical-align: middle;

here a print

You need to inspect elements to see what is going on.
What is your template?

If you inspect elements in Chrome you’ll see if ion-card is either taking all width or not.
Which element has display: flex;
Is it the immediate parent of ion-cards?

If you’re aligning why not just use the rows and the columns?

Ionic V1 (if I remember right):

<div class="row">
    <div class="col col-4">left column</div>
    <div class="col col-4">middle column</div>
    <div class="col col-4">right column</div>
</div>

There’s also rules and properties to which can align to special sides per-request/pull options.

Ionic V2+:

  <ion-row>
    <ion-col col-4>
      Left
    </ion-col>
    <ion-col col-4>
      Middle
    </ion-col>
    <ion-col col-4>
      Right
    </ion-col>
  </ion-row>

I haven’t used Ionic V2+ Grids/Rows/Columns before.

Columns should always be equivalent to 12 in total (unless Ionic changed something in new updates).

Refer to the Docs:

ion-grid: Display Grids for Mobile-First Custom App Layout

Regards,
Neonic1