如何从底部强制角度材料 2 sidenav 内容答案

【问题标题】：How to force angular material 2 sidenav content from bottom如何从底部强制角度材料 2 sidenav 内容
【发布时间】：2017-11-26 13:04:34
【问题描述】：

已经在 css 中尝试了几个地方来覆盖 angular material 2 中现有的 sidenav 组件

mat-sidenav-container {
   background: white;
   bottom: 0px !important; /* <---- no help */
}
mat-sidenav {
   width: 300px;
   height: 500px;


   padding-left:20px;   /* Not sure why content goes out of range*/
   bottom: 0px !important; /* <---- no help */
}

Trying to make sidenav content start from bottom in this example 但我似乎无法覆盖 angular material 2 提供的此组件中的任何内容

【问题讨论】：

标签： css angular angular-material2

【解决方案1】：

为此，无需重写 .mat 类样式。使用下面的 css 将内容放在底部。

侧导航内容：

 <div class="inner-content" id="botNav" mat-list-item>
    <button mat-button *ngFor="let app of apps">{{ app }}</button>
 </div>

Css 放置内容：

.inner-content{
  position: absolute;
  bottom: 0;
  left: 0;
}

演示：https://plnkr.co/edit/GZroFhKjuXhtYu7bvgPK?p=preview

【讨论】：