我刚开始使用Material Design Lite。我想改变抽屉的宽度。
我所尝试的是这些方面:
.mdl-layout__drawer {
width: 25%;
}
这会导致抽屉与内容区域重叠。
如何更正此问题?
答案 0 :(得分:7)
抽屉是一个绝对组件,在其父容器中放置一个定义的左侧位置。当你改变它的宽度时,你也需要改变它的位置。
这里是宽度为500px的css唯一解决方案 -
.mdl-layout__drawer {
width: 500px;
left: -250px;
}
.mdl-layout__drawer.is-visible {
left: 0;
}
这是一个代码示例 - http://codepen.io/mdlhut/pen/pJmjBe