css - Bagaimanakah reka letak grid dalam ionik membenarkan kandungan dalam setiap lajur dengan kandungan teks yang berbeza-beza dipusatkan secara menegak?

Question

Setiap lajur data dijana oleh traversal sudut
Kesannya adalah seperti berikut:

Oleh kerana teks nama di sebelah kiri sedikit berbeza, data di sebelah kanan akan dipaparkan ke atas saya telah mencuba display: table-cell;
vertical-align: middle;, tetapi saya juga mencuba menggunakan tetapan ketinggian garisan. Tetapi ia juga tidak berfungsi.
Struktur kod adalah seperti ini:
<ion-row *ngFor="let row of config.rows">

    <ion-col col-3>{{row.rowName}}</ion-col>  <!-- 左侧名称 -->
    <ion-col *ngFor="let col of row.cols">{{col.data.value}}</ion-col>  <!-- 右侧数据 -->

</ion-row>
Tiga lajur data di sebelah kanan dijana oleh traversal bersatu

Menggunakan align-self-center ionic, saya mendapati terdapat masalah dengan garisan bingkai meja Sila selesaikan

<ion-row *ngFor="let row of config.rows">

    <ion-col col-3> {{row.rowName}}</ion-col>
    <ion-col align-self-center>
      <ion-row>
        <ion-col *ngFor="let col of row.cols">{{col.data.value}}
        </ion-col>
      </ion-row>
    </ion-col>

</ion-row>

Answer 1

display:flex; align-items:center