<fieldset>作为Flex容器在Google Chrome中无效

Question

由于某些原因，我无法让Chrome正确使用正确的宽度，并在将内容应用于 fieldset标记后将内容包装在Flex容器中。它适用于Firefox，甚至令人厌恶IE11（具有最大宽度的黑客攻击），但我无法让Chrome正确显示它。

HTML：

<form>
    <fieldset class="flex">
        <label>Text 1</label>
        <label>Text 2</label>
    </fieldset>
</form>

最小的CSS：

.flex {
    display: flex;
    flex-flow: wrap row;
    width: 100%;
}

.flex > * {
    flex: 0 1 50%;
    max-width: 50%; /* IE fix */
}

如果剩下足够的宽度，这应该显示彼此相邻的两个标签，而不是一个在另一个之下。不幸的是，后者就是Chrome的情况......

这是一个带有一些附加视觉效果的测试用例：https://jsfiddle.net/m48e3gxe/

如何让它在Chrome中运行？