删除固定网格行对齐

Question

我正在使用ionic-3来创建网格布局。

<ion-content>
  <ion-row>
    <ion-col col-12 col-xl-4 *ngFor="let news of news">
      <ion-card>
        <ion-card-content>
          <img [src]="news.image"/>
          <ion-card-title>
            {{news.title}}
          </ion-card-title>
          {{news.text}}
        </ion-card-content>
        <ion-row>
          <ion-col text-right>
            <ion-note>
              {{news.publish_at}}
            </ion-note>
          </ion-col>
        </ion-row>
      </ion-card>
    </ion-col>
  </ion-row>
</ion-content>

这导致如下所示的布局：

相反，我希望的结果是：

可以将其描述为默认的bootstrap方法。

我需要做些什么来获得首选布局？