md-sidenav content is not accessible when browser's size is reduced

[lokeshdaiya]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

md-sidenav content should be accessible when browser size is resized.

What is the current behavior?

when browser is resized it does not show the content

What are the steps to reproduce?

https://plnkr.co/edit/nSGrAiVAAoxZZ19Mxp8J?p=preview

1. Open the example shared in plnkr in full screen mode.
2. scroll to extreme down so thay you can see sidenav!29
3. Now resize the browser 1044 x 567
4. you well notice that scroll touched to extreme bottom and you can't see items below sidenav!20 until again you click on the scroll.
   
   

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

material beta8 to beta11

Is there anything else we should know?

Same is reproducible at https://material.angular.io/components

[mmalerba]

documentation update in #7775 includes an example demonstrating how to do a responsive sidenav. https://material.angular.io has also been updated with a responsive sidenav

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}