css - ionic中的柵格佈局如何讓文字內容多少不同的每一列中的內容都能垂直居中？

Question

每一列資料是由angular遍歷產生
效果如下圖：

因為左側名稱文字多少不同，所以右側資料會出現偏上顯示情況，已經試了display: table-cell;
vertical-align: middle;，但沒效果，也試了用line -height設置，但也不行，求大神指點，多謝啊！
程式碼結構是這樣的：
<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>
右側三列資料是統一遍歷產生的

使用ionic的align-self-center，發現表格的框線會出問題，求解啊啊啊啊啊

#<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

顯示：伸縮；對齊項目：中心