title: flex layout not working properly
body: <p>i am using flex layout module in angular 4, i trying card layout in  desktop mode side by side need to show and the same when mobile mode it should be one below one, but its not working for me plz suggest proper code.</p>
  
  <p>below is my code:</p>
  
  <pre><code>&lt;div fxLayout="row" fxLayout-gt-xs="column"&gt;
       &lt;mat-card fxflex fxflex-gt-xs="100"  fxFlex="33.33%"&gt;
            &lt;h2&gt;Card title #1&lt;/h2&gt;
                &lt;mat-card-content&gt;
                    &lt;p&gt;Some content&lt;/p&gt;
                &lt;/mat-card-content&gt;
       &lt;/mat-card&gt;
       &lt;mat-card fxflex  fxflex-gt-xs="100" fxFlex="33.33%"&gt;
            &lt;h2&gt;Card title #2&lt;/h2&gt;
                &lt;mat-card-content&gt;
                     &lt;p&gt;Some content&lt;/p&gt;
                &lt;/mat-card-content&gt;
       &lt;/mat-card&gt;
  </code></pre>
  
  <p>  </p>
  
  <p>using this version:   <code>@angular/flex-layout</code>: <code>^2.0.0-beta.9</code></p>