对齐按钮文本和其他离子-COL文本底部在离子2

Question

我的代码看起来像：

<ion-row><ion-col ><button ion-button outline no-padding large (click)="setUserName()">D</button>ay in the life </ion-col></ion-row> 

为字母d进入在中间和整体山口文本上方的位这看起来难看。

所有我想要的是一切底部对齐。

Answer 1

发生了什么？

.row { 
 
    display: flex; 
 
    flex-wrap: wrap; 
 
} 
 

 
.col { 
 
    position: relative; 
 
    width: 100%; 
 
    margin: 0; 
 
    min-height: 1px; 
 
    -webkit-flex-basis: 0; 
 
    -ms-flex-preferred-size: 0; 
 
    flex-basis: 0; 
 
    -webkit-flex-grow: 1; 
 
    -ms-flex-positive: 1; 
 
    flex-grow: 1; 
 
    max-width: 100%; 
 
}

<ion-row class='row'> 
 
    <ion-col class='col'><button ion-button outline no-padding large (click)="setUserName()">D</button>ay in the life </ion-col> 
 
</ion-row>