角材料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不覆盖整个屏幕上滚动

回答

相关问题