Ionic2與高度相等內容

我試圖做的1-row * 2-col一個網格如下腰束：Ionic2與高度相等內容

<ion-grid> 
    <ion-row *ngFor="let products of productsArray"> 
     <ion-col center text-center col-6 *ngFor="let product of products"> 
     <ion-card (click)="onProductClick(product)"> 
      <ion-badge *ngIf="product.on_sale" class="badge-onSale" item-right>Sale</ion-badge> 
      <img src="{{product.featured_src}}" /> 
      <ion-card-content> 
      <ion-card-title style="font-size: 100%"> 
       {{ product.title | StripHTML }} 
      </ion-card-title> 
      </ion-card-content> 
      <ion-row center text-center> 
      <p style="color: red"> 
       {{ product.price_html | StripHTML:{split:" ",index:0} }} 
      </p> 
      </ion-row> 
     </ion-card> 
     </ion-col> 
    </ion-row> 
    </ion-grid>

但由於每個card->content-height的cards/rows的差別，不是相同的高度，我會怎樣解決這個問題？

來源

2017-05-02 Abanoub

你不能給它一個固定的高度並設置溢出滾動？ –

也許嘗試在列上使用'align-self-stretch'（http://ionicframework.com/docs/api/components/grid/Grid/） – mosca90

謝謝，我已經修好了:) – Abanoub

我固定它，加入這些樣式ion-col

.product-col{ 
    display: flex; 
    justify-content: center; 
}

，現在它按預期工作！

來源

2017-05-03 17:28:05 Abanoub

Ionic2與高度相等內容

回答

相關問題