css - page shoud not scroll when using sidenav and toolbar together in angular material -
when use md-sidenav without having md-toolbar, ok. means that, opening sidnav perform correctly image below.
but when add toolbar before sidenav or before section containing sidenav, upon opening sidenav page find scroll , sidenav not fill entire page's height(image below), while should same before. toolbar height size add height of page.
here main part of code:
<div ng-controller="appctrl" layout="column" layout-fill> <md-toolbar> <div class="md-toolbar-tools" layout="row" style="background-color:crimson"> ... </div> </md-toolbar> <section layout="row" flex> <md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="$mdmedia('gt-md')"> ... </md-sidenav> <md-content flex layout-padding> ... </md-content> <md-sidenav class="md-sidenav-right md-whiteframe-z2" md-component-id="right"> ... </md-sidenav> </section> </div>
i solved problem using different layout of page. using md-sidenav before md-toolbar:
<div layout="row"> <md-sidenav> </md-sidenav> <div layout="column"> <md-toolbar> </md-toolbar> <md-content> </md-content> </div> </div>
Comments
Post a Comment