角材料Sidenav不覆蓋整個屏幕上滾動

在滾動，Sidenav不考慮屏幕的100％，它也滾動。

<div layout="column"> 
    <section layout="row" flex> 
     <!-- sidenav content --> 
     <md-sidenav class="md-sidenav-left" 
        md-component-id="left" 
        md-whiteframe="20" 
        flex> 
      <md-content layout-padding></md-content> 
     </md-sidenav> 
     <md-content flex layout-padding> 
      <!-- page content --> 
      <md-content>Page Content</md-content> 
     </md-content> 
    </section> 
</div>

來源

2017-05-08 Amit Singh

您可以創建的jsfiddle/plunkr解決方案？ –

確保sidenav是'position：fixed'，'height：100vh'。如果可能的話，也創建一個小提琴。 – Josh

只需將div的md-sidenav外：

<!-- sidenav content --> 
<md-sidenav class="md-sidenav-left" 
    md-component-id="left" 
    md-whiteframe="20" 
    flex> 
    <md-content layout-padding></md-content> 
</md-sidenav> 
<div layout="column"> 
    <section layout="row" flex> 
     <md-content flex layout-padding> 
      <!-- page content --> 
      <md-content>Page Content</md-content> 
     </md-content> 
    </section> 
</div>

Codepen Demo

來源

2017-05-10 07:47:33 Edric

角材料Sidenav不覆蓋整個屏幕上滾動

回答

相關問題