title: Internet Explorer doesn't honor my min-height: 100% with flexbox
body: <p>I've been looking through all the min-height: 100% solutions on StackOverflow and the web and I can't seem to find one that fits my (relatively simple) needs.</p>
  
  <p>Here's what I want:</p>
  
  <ol>
  <li>I have a two column container, and both columns should stretch to be equal height.</li>
  <li>When the content doesn't fill the screen, the columns should stretch to the full window height.</li>
  <li>I'm happy to use flex-box, but I'd prefer not to use JS hacks if possible.</li>
  </ol>
  
  <p>Example Code:</p>
  
  <p><a href="http://codepen.io/anon/pen/dwgDq?editors=110" rel="noreferrer">http://codepen.io/anon/pen/dwgDq?editors=110</a></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;body&gt;
      &lt;div class="container"&gt;
        &lt;div class="nav"&gt;
          &lt;p&gt;Item 1&lt;/p&gt;
          &lt;p&gt;Item 2&lt;/p&gt;
          &lt;p&gt;Item 3&lt;/p&gt;
          &lt;p&gt;Item 4&lt;/p&gt;
          &lt;p&gt;Item 5&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="content"&gt;
          &lt;p&gt;Content 1&lt;/p&gt;
          &lt;p&gt;Content 2&lt;/p&gt;
          &lt;p&gt;Content 3&lt;/p&gt;
          &lt;p&gt;Content 4&lt;/p&gt;
          &lt;p&gt;Content 5&lt;/p&gt;
          &lt;p&gt;Content 6&lt;/p&gt;
          &lt;p&gt;Content 7&lt;/p&gt;
          &lt;p&gt;Content 8&lt;/p&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  
  html, body { height: 100%; margin: 0; }
  
  .wrapper {
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .container {
    display: flex;
    align-items: stretch;
    min-height: 100%;
  }
  
  .nav {
    background: grey;
    width: 200px;
  }
  
  .content {
    flex-grow: 1;
    background: yellow;
  }
  </code></pre>
  
  <p>This works perfectly in Safari and Chrome.</p>
  
  <p>It appears as if IE (v11 in my case) doesn't honor my min-height and thus, the columns don't fill the height of the screen. From what I read, IE6+7 had issues with treating height as min-height, but this is a relic of the past and long gone when using an HTML5 doctype.</p>
  
  <p>How do I make IE honor my min-height?</p>
  
  <p>How do I make this layout work?</p>