mdl-layout__header--scroll not working in small screen

[ghost]

In small screen, the header is no longer scrollable even with mdl-layout__header--scroll. Is it possible enable this in small screen as well? At least tell me how i can achieve this. Thanks

Another simple question, If i add below css modification to mdl layout, will there be any implication? So far it looks fine to me. I need this because i use mdl in concrete5 which has a fixed toolbar on top. Kind of like mdl header. Without this css hack, i would have double scrollbar. The overflow can be any value other than auto or scroll. Please advise. Thanks

.mdl-layout {overflow-y:visible !important; overflow-x:visible !important; }

[sgomes]

Thanks for the issue, @vince8864! Any chance you can share a codepen that illustrates the issue?

[ghost]

http://codepen.io/anon/pen/WwwmPW
Just resize the windows size to tablet or phone size then you can see the header is no longer scrollable.
I just realize i added mdl-layout--fixed-header along with mdl-layout__header--scroll. But then even without the mdl-layout--fixed-header, the header is still not scrollable once the screen size become smaller. Having scrollable header is not an MD spec indeed but since you provide that option, just wondering if we can make the effect more consistent regardless of screen size.

[sgomes]

Yup, I can confirm. Thanks for the bug, @vince8864, I'll look into this!

[sgomes]

Hey @vince8864. I took a look at this today, and I can't find a backwards-compatible way of fixing this. Basically, the reason this happens is because of a bugfix that's intended to prevent scrolling beyond the end of a large drawer:

You can try adding the following CSS to your project and testing whether this solves the problem for you, although it may introduce the above bug:

.mdl-layout__container.has-scrolling-header .mdl-layout--fixed-header .mdl-layout__content {
  overflow-y: visible;
  overflow-x: visible;
  overflow: visible;
}

V2 will have a completely revamped way of doing layout; I'm keeping this bug open until that's implemented, both as a reminder and as information for anyone running into the same bug as you.

[ghost]

Hi sgomes, your suggested css works wonder for me. Here is my output.
First, i guess .mdl-layout--fixed-drawer and mdl-layout__header--scroll are not meant to be used together due to the drawer height is fixed somehow. No need to do anything about it really.
http://codepen.io/vince8864/pen/ONWWmN

Second, after applying your suggested css, the header is now scrollable regardless of browser size.
http://codepen.io/vince8864/pen/oxBBzV

Thanks for everything. The word revamped seem exciting yet intimidating. Hope nothing breaks. 😄