Ion-row wrap does not seem to be working

Ionic Framework ionic-v3
1

Hi, I am trying to create a loop where images are displayed in a 2 column format. I know I can use modulus math and/or the even property to create rows each time there is an even index, but I’m trying to avoid that and simply to a row wrap (as described here)

My code is as follows:
[ignore the isEven part - I was just testing this property)

I tried this on iOS and the columns don’t wrap at all - they go offscreen the moment I add the 3rd photo.

Appreciate any thoughts

<ion-row wrap>
    <ion-col width-50 *ngFor="let item of checklist.items; let isEven=even">
      <ion-card>
        <img src="{{item.photo}}" />
         <ion-card-content>
          <ion-card-title>{{item.title}}</ion-card-title>
          <p>Descriptive text: {{isEven}}</p>
        </ion-card-content>
        <ion-note>Dec 12, 2017</ion-note>
      </ion-card>
    </ion-col>
  </ion-row>
2

Okay, problem solved via this thread. Looks like iOS needs more handling.

1 Like