title: Getting Angular material fixed sidebar and header
body: <p>My DOM structure goes like this:</p>
  
  <pre><code>&lt;div layout="column" layout-fill&gt;
   &lt;header &gt;Must be fixed&lt;/header&gt;
   &lt;md-sidenav md-component-id="left" layout="row" layout-fill&gt;
    Sidenav should be fixed
   &lt;/md-sidenav&gt;
   &lt;div layout="column" layout-fill&gt;
     &lt;div&gt;
       Main content
     &lt;/div&gt;
   &lt;footer&gt;Sticky footer&lt;/footer&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>I want a header and sidenav to be fixed, just like in angular material doc site. With a sticky footer also, what should be my basic approach?</p>