大佬教程收集整理的这篇文章主要介绍了css – 不能将angular2-material md-sidenav取为100%的高度,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是我的模板:
<md-sidenav-layout class="demo-sidenav-layout"> <md-sidenav #start mode="over"> <a [routerLink]="['/login']" class="btn btn-priMary">Log in</a> <br> </md-sidenav> <md-toolbar color="priMary"> <button md-button (click)="start.toggle()">Open Side Drawer</button> <span>Spellbook</span> <span class="demo-fill-remaining"> </span> </md-toolbar> <div class="demo-sidenav-content"> <router-outlet></router-outlet> </div> </md-sidenav-layout>
这里是我的CSS:
.demo-sidenav-layout { //border: 3px solid black; min-height:100%; md-sidenav { padding: 10px; BACkground: gainsboro; min-height: 100%; } } .demo-sidenav-content { padding: 15px; min-height:100%; } .demo-toolbar { padding: 6px; .demo-toolbar-icon { padding: 0 14px 0 14px; } .demo-fill-remaining { flex: 1 1 auto; } }
我也有html设置为height:100%,body设置为min-height:100%
<md-sidenav-layout fullscreen> <md-sidenav #start mode="over"> <a [routerLink]="['/login']" class="btn btn-priMary">Log in</a> <br> </md-sidenav> <md-toolbar color="priMary"> <button md-button (click)="start.toggle()">Open Side Drawer</button> <span>Spellbook</span> <span class="demo-fill-remaining"></span> </md-toolbar> <div class="demo-sidenav-content"> <router-outlet></router-outlet> </div> </md-sidenav-layout>
以上是大佬教程为你收集整理的css – 不能将angular2-material md-sidenav取为100%的高度全部内容,希望文章能够帮你解决css – 不能将angular2-material md-sidenav取为100%的高度所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。