css - ionic中的柵格布局如何讓文字內(nèi)容多少不同的每一列中的內(nèi)容都能垂直居中?
問題描述
每一列數(shù)據(jù)是由angular遍歷生成效果如下圖:
因?yàn)樽髠?cè)名稱文字多少不同,所以右側(cè)數(shù)據(jù)會(huì)出現(xiàn)偏上顯示情況,已經(jīng)試了display: table-cell; vertical-align: middle;,但是沒效果,也試了用line-height設(shè)置,但也不行,求大神指點(diǎn),多謝啊!代碼結(jié)構(gòu)是這樣的: <ion-row *ngFor='let row of config.rows'>
<ion-col col-3>{{row.rowName}}</ion-col> <!-- 左側(cè)名稱 --> <ion-col *ngFor='let col of row.cols'>{{col.data.value}}</ion-col> <!-- 右側(cè)數(shù)據(jù) -->
</ion-row>右側(cè)三列數(shù)據(jù)是統(tǒng)一遍歷生成的
使用ionic的align-self-center,發(fā)現(xiàn)表格的框線會(huì)出問題,求解啊啊啊啊啊

<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>
問題解答
回答1:display:flex; align-items:center
相關(guān)文章:
1. 我在centos容器里安裝docker,也就是在容器里安裝容器,報(bào)錯(cuò)了?2. docker-compose中volumes的問題3. docker不顯示端口映射呢?4. golang - 用IDE看docker源碼時(shí)的小問題5. 在windows下安裝docker Toolbox 啟動(dòng)Docker Quickstart Terminal 失敗!6. docker容器呢SSH為什么連不通呢?7. javascript - 最近用echarts做統(tǒng)計(jì)圖時(shí)遇到兩個(gè)問題!!8. mac里的docker如何命令行開啟呢?9. javascript - 連續(xù)點(diǎn)擊觸發(fā)mouseleave事件10. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””

網(wǎng)公網(wǎng)安備