Ionic2グリッドカラム

Question

ionic2で各行に2つの項目（2列）を収めようとしていますが、機能しません。

<ion-grid> 
    <ion-row wrap> 
    <ion-col width-50 *ngFor="let item of items"> 
     <div class="myCell"> 
     <div class="card"> 

     <div class="item item-body"> 
     <img class="full-image" src="..."> 
      <div class="item item-avatar"> 
      <img src="..."> 
      </div> 
      <div style="font-size:3vw;margin:2vw"> {{item.name}}</div> 
     </div> 
     </div> 
     </div> 
     </ion-col> 
    </ion-row> 

I use this code but it still not working, someone knows something about this difficult topic? 

おかげ

Answer 1

イオンは、12列を有するブートストラップに似たグリッドシステムを使用します。 したがって、列の幅の50％を使用するには、それぞれ6列のスペースを取らなければなりません（100％は12列なので）。

width-50からcol-6に変更してください。

<ion-col col-6 *ngFor="let item of items"> 

Answer 2

<ion-grid> 
    <ion-row> 
     <ion-col col-6 *ngFor="let item of items"> 
      <div class="myCell"> 
       <div class="card"> 
       <div class="item item-body"> 
        <img class="full-image" src="..."> 
        <div class="item item-avatar"> 
         <img src="..."> 
        </div> 
        <div style="font-size:3vw;margin:2vw">  
         {{item.name}} 
        </div> 
       </div> 
       </div> 
      </div> 
     </ion-col> 
    </ion-row> 
    </ion-grid> 

これはそれを

を修正する必要があります