title: <fieldset> as flex container not working in Google Chrome
body: <p>For some reason, I can't get Chrome to properly use the correct width and wrap content in a flex container once it's applied to <strong>fieldset tag</strong>. It works in Firefox and even disgusting IE11 (with a max-width hack), yet I can't get Chrome to display it correctly.</p>
  
  <p>HTML:
  </p>
  
  <pre><code>&lt;form&gt;
      &lt;fieldset class="flex"&gt;
          &lt;label&gt;Text 1&lt;/label&gt;
          &lt;label&gt;Text 2&lt;/label&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Minimal CSS:
  </p>
  
  <pre><code>.flex {
      display: flex;
      flex-flow: wrap row;
      width: 100%;
  }
  
  .flex &gt; * {
      flex: 0 1 50%;
      max-width: 50%; /* IE fix */
  }
  </code></pre>
  
  <p>Given there is enough width left, this should show the two labels next to each other instead of one below the other. Unfortunately, the later is the case for Chrome...</p>
  
  <p>Here is a testcase with a few added visuals: <a href="https://jsfiddle.net/m48e3gxe/" rel="nofollow noreferrer">https://jsfiddle.net/m48e3gxe/</a></p>
  
  <p>How can I make it work in Chrome?</p>