2017-11-25 170 views
0

角材2 sidenav内容一直在尝试几个地方在CSS中的角材2如何强制从底部

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 覆盖现有sidenav组件,但我似乎无法在此组件覆盖任何东西由角材料提供2

回答

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