1

我正在动态显示卡片。例如，每行有 3 张卡片，它们的宽度相等。当我调整浏览器窗口的大小时，卡片的宽度不均匀。一些卡片以不同的宽度尺寸显示。例如，第一行只有一张卡片，第二行有两张宽度不等的卡片。

 Expected result : 1. cards to be displayed in 3 columns with equal width (large screen)
2. cards to be displayed in 2 columns with equal width  (medium screen)
3. cards to be displayed in 1 column with equal width  (mobile phone)

为了在所有屏幕尺寸上均匀显示，我需要为 flex 布局设置哪些可能的值？

这些是使用的版本

Angular version - 2.4.10
"@angular/material": "2.0.0-beta.2",
"@angular/flex-layout@2.0.0-beta.5"

这是示例代码

<div fxLayout="row" fxLayoutWrap  style="padding-bottom: 15px; 
 padding-top: 15px;  margin: auto;justify-content: center" >  
<md-card fxFlex.gt-md="30" fxFlex.md="30"  fxFlex.sm="auto" fxFlex.xs="100" *ngFor="let data of myArray" style="margin:5px;">
          <md-card-content>
            <h1></h1>
            <h2></h2>
           <h2></h2>
          </md-card-content>
          </md-card> 
        </div>
4

0 回答 0