title: flexbox min-width failing in IE and Edge
body: <p>I have some table that set width for  elements so some columns will have at least some percent of a width of the container.</p>
  
  <p>I want to use flexbox to center this table and set the minimum-width for it.</p>
  
  <p><strong>The goal is to have centered table with some minimum width for which some columns will have the same width (same ratio).</strong> </p>
  
  <p>If some cells have longer texts then I don't care if ratio will broke (width of this column will be bigger then other). I just care that it has nice and same width of columns  for common case (small amount of text data in cells)</p>
  
  <p>I was able to came up with solution that works on Firefox and Chrome (<a href="https://codepen.io/mpawelski/pen/WYWraY" rel="nofollow noreferrer">link</a>). </p>
  
  <p>But for Edge and IE11 the table stretch as if it was not in flex container (try to comment <code>display: flex;</code> on Firefox or Chrome and the result is stretched table like on Edge.</p>
  
  <p>Also it looks that <em>sometime</em> setting columns work (<a href="https://codepen.io/mpawelski/pen/QJPNQw" rel="nofollow noreferrer">link2</a>). But I don't see the pattern of when it break in Edge/IE11.</p>
  
  <p>Here is more production example that I want to achieve (works in Chrome/Firefox, stretch in Edge/IE11): <a href="https://codepen.io/mpawelski/pen/PxgNxv" rel="nofollow noreferrer">"production" table example</a>.</p>
  
  <p>Any ideas how to achieve what I want on Edge/IE11? (I put in bold what I want to achieve). </p>
  
  <p>It would be good if I could keep using flexbox container (it might require more changes in my codebase) but I think I will be fine with deleting <code>style=width:p%</code> from <code>&lt;col&gt;</code> if that's necessary.</p>