2016-04-01 23 views
0

Ben açısal-md oldukça yeni ve sağda kartlarla sidenav - yapmaya çalışıyorum. Kod http://codepen.io/anon/pen/qZPRmqangular-md md-ızgara listesi md-sidenav altında gizler

<body ng-app="BlankApp" ng-cloak layout="column"> 
<div flex layout="row"> 
    <md-sidenav md-is-locked-open="true" class="md-sidenav-left md-whiteframe-z2" layout="column"> 
     Some form here 
    </md-sidenav> 

    <!-- Container #4 --> 
    <md-content flex layout="column" class="md-padding" layout-padding> 
     <md-grid-list flex md-cols-xs="1" md-cols-sm="2" md-cols-md="4" md-cols-gt-md="6" 
         md-row-height="2:2" md-gutter="12px" md-gutter-gt-sm="8px"> 
      <md-grid-tile flex> 
       <md-card> 
        First card here 
       </md-card> 
       <md-card> 
        Second card here 
       </md-card> 
      </md-grid-tile> 
     </md-grid-list> 
    </md-content> 
</div> 

zor değil Ama sorun o md-grid-kiremit md-içerik bloktan kaçar ve almak en sidenav tarafından çakışan (ve bazen md-araç çubuğu tarafından) 'dir. Ne yapıyorum yanlış? Problematic layout

cevap

1

Değişim

 <md-grid-tile flex> 
      <md-card> 
       First card here 
      </md-card> 
      <md-card> 
       Second card here 
      </md-card> 
     </md-grid-tile> 

 <md-grid-tile> 
      <md-card> 
       First card here 
      </md-card> 
     </md-grid-tile> 
     <md-grid-tile> 
      <md-card> 
       Second card here 
      </md-card> 
     </md-grid-tile> 
için