angular-md md-grid-list скрывается под md-sidenav

Я новичок в angular-md и пытаюсь сделать очевидную вещь - сиденав с карточками справа. Код не такой сложный http://codepen.io/anon/pen/qZPRmq

<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>

Но проблема в том, что md-grid-tile убегает от блока md-content и перекрывается sidenav (а иногда и md-toolbar). Что я делаю неправильно? Проблемный макет


angularjs angular-material
person akashihi    schedule 01.04.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Изменять

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

to

        <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>
person WuDo    schedule 01.04.2016