如何使材料设计精简抽屉位置动态？

Question

刚开始使用material design lite来创建一个网站。好东西。

滚动时，我设法破解标题以保持固定在页面顶部：

HTML

<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header" >
            <header class="mdl-layout__header">
                <div class="mdl-layout__header-row">

等..就像在演示中一样

CSS

body div header{
    position: fixed;
}

现在滚动时，标题会保留在页面顶部及其所有元素;没问题。

然而，当我按下汉堡包按钮打开抽屉时，只有当滚动位于页面顶部时，它才会正确显示。如果页面在较低的位置滚动，则隐藏部分抽屉。

知道如何解决这个问题吗？

请注意，我无法找到更好的方法将标题保持在顶部，因此可能是真正的问题（即position: fixed;部分）