title: Scrollable router outlet in Angular
body: <p>My page is pretty simple. I want a fixed header and footer regardless of the screen size, and want only the content to be scrolled if it is more(if the content overflows).</p>
  
  <pre><code>&lt;div class="header"&gt;
   &lt;h2&gt;Title&lt;/h2&gt;
  &lt;/div&gt;
  &lt;div class="content"&gt;
    &lt;router-outlet&gt;&lt;/router-outlet&gt;
  &lt;/div&gt;
  &lt;div class="footer"&gt;
    &lt;h2&gt;footer&lt;/h2&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I am trying something like this and the exact below code is not working.</p>
  
  <p><a href="https://stackoverflow.com/questions/4069734/fixed-header-footer-with-scrollable-content">Fixed header, footer with scrollable content</a></p>