角材料md-subheader不粘

Question

I'm using several <md-subheader> s on my page, but they are not sticking to the top when the user scrolls down (like in the demo ). 我在页面上使用了几个<md-subheader> ，但是当用户向下滚动时（例如在演示中），它们并没有停留在顶部。

Any ideas? 有任何想法吗？ Maybe my layout is causing the problem? 也许我的布局引起了问题？

<body>
  <div>
    <md-toolbar>
    <div>
      <md-sidenav>
      <md-content>
        <section>
          <md-subheader>
...

Here is a codepen . 这是一个codepen 。

Based on another question I had , just adding layout="column" layout-fill to the top div works, too. 根据我遇到的另一个问题，只需将layout="column" layout-fill到顶部div 。

Answer 1

The section s fit inside md-content . 该section适合md-content 。 So, when you scroll, you don't scroll inside md-content . 因此，滚动时不会在md-content内部滚动。 In order for the stickiness to work, you should scroll inside of md-content . 为了使粘性起作用，您应该在md-content内部滚动。

I gave a height of 500px to md-content so that you can see the effect. 我为md-content了500px的高度，以便您可以看到效果。

<md-content layout="column" layout-padding flex style="height: 500px;">

    <!-- Report content -->

    <section ng-repeat="i in [1,2,3,4,5]">

Here is the working codepen . 这是工作码本。

角材料md-subheader不粘

问题描述

1 个解决方案

解决方案1
1 已采纳 2016-03-25 06:03:46

角材料md-subheader不粘

问题描述

1 个解决方案

解决方案1 1 已采纳 2016-03-25 06:03:46

解决方案1
1 已采纳 2016-03-25 06:03:46