title: Flex - children fixed position and 100% height
body: <p>A menu that is fixed with 100 height (stretched over the height).
  If het content in the menu is growing outside the div a scrollbar must be shown within the menu. It may not grow more than the 100 height.</p>
  
  <p>the page-content may grow to any height (min-height also stretched over the height of the parent). If the content size is growing the default scrollbar must be shown (on the right)  </p>
  
  <p>HTML:   </p>
  
  <pre><code>&lt;div class="module"&gt;
        &lt;nav class="vertical-menu"&gt;
          &lt;header&gt;
            &lt;h5&gt;Menu&lt;/h5&gt;
          &lt;/header&gt;
          &lt;div class="menu-links"&gt;
            menu link&lt;br/&gt;
            menu link&lt;br/&gt;
            menu link&lt;br/&gt;
            menu link&lt;br/&gt;
            menu link&lt;br/&gt;
            menu link&lt;br/&gt; 
          &lt;/div&gt;
        &lt;/nav&gt;
        &lt;div class="page-content"&gt;
          Some content&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
          another line&lt;br/&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>    .module {
        display: flex;
        width: 100%;
        height: 100%;
        background-color: lightgray;
      }
  
      .vertical-menu {
        margin: 10px 0;
        width: 300px;
        background-color: coral;
        flex-shrink: 0;
        align-items: stretch;
      }
  
      .vertical-menu h5 {
        font-size: 23px;
        padding: 10px 22px;
        border-bottom: 2px solid black;
      }
  
      .page-content {
        margin: 10px;
        background: tomato;
        flex-grow: 1;
      }
  </code></pre>
  
  <p>Codepen <a href="https://codepen.io/Babulaas/pen/ZoPvmO" rel="nofollow noreferrer">https://codepen.io/Babulaas/pen/ZoPvmO</a></p>
  
  <p>I hope someone can help me with this issue.</p>