Ionic2 Rasterspalten

Question

Ich versuche, zwei Elemente (zwei Spalten) in jeder Zeile mit ionic2 anzupassen, aber es funktioniert nicht.

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

Dank

Answer 1

Ionic verwendet ein Rastersystem, ähnlich wie Bootstrap, die 12 Spalten. Wenn Sie also möchten, dass Ihre Spalten 50% der Breite einnehmen, müssen sie den Abstand von jeweils 6 Spalten einnehmen (da 100% 12 Spalten sind).

Ändern Sie einfach Breite-50 zu 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> 

Dies sollte es beheben