在AngularJs材质中对齐指定数量的列

Question

我使用md-card使用Angular Material 1.4.1列出商品 - AngularJS 1.X.X

我有一个集合ProductList，它包含10个以上的项目。根据卡片需要对齐的窗口宽度，每个md-card应为200 px宽度。如果卡片尺寸超过窗口宽度，则卡片的其余部分需要到达下一行

我的代码：

<div layout-gt-sm="row" layout-padding style="width:100%; background-color:white;">
    <md-card ng-repeat="item in ProductList">
      <md-card-header>
        <md-card-header-text layout="row">
          <span class="md-title">{{item.Name}}</span>
          <span class="md-subhead"> </span>
        </md-card-header-text>
      </md-card-header>
      <md-card-content>
        <p>{{item.Description}}</p>
      </md-card-content>
    </md-card>
  </div>

现在，我使用layout-gt-sm="row"，因此它会在一行中显示所有卡片。

请根据自己的响应情况协助我如何安排卡片。