css – 如何在角度材料设计中改变Sidenav的宽度？

无论我使用什么屏幕尺寸，Sidenav总是相同的大小。我尝试添加属性，如
– 柔性
– flex =“85”(得到其容器的85％)

似乎找不到一个好办法。

解决方法

在角质材料中，md-sidenav具有以下属性：

width: 304px;
min-width: 304px;

这就是为什么宽度将固定在304像素，无论你使用什么设备。
所以如果你想改变你的sidenav宽度，你将不得不改变css一点。

如果您只支持现代浏览器，您可以将其更改为vw度量(视口宽度的1/100)，并将其添加到单独的css文件。代码将如下所示：

md-sidenav,md-sidenav.md-locked-open,md-sidenav.md-closed.md-locked-open-add-active {
    min-width: 200px !important;
    width: 85vw !important;
    max-width: 400px !important;
}

这是一个坑：http://plnkr.co/edit/cXfJzxsAFXA3Lh4TiWUk?p=preview