Flexbox - 将中间元素移动到下一行（无媒体查询）

Question

我想要实现的目标（但没有媒体查询）：

JsFiddle

@media all and (max-width: 600px) {
  #wrapper {
    flex-wrap:wrap;
    height: 100px;
  }

  .center {
    width: 100%;
    order: 3;
  }

  .left{
    width: 50%;
  }

  .right {
    width:50%;
    order:2;
  }
}

我在包装器中有3个元素，所有元素都缩小了。在桌面大小，剩下一些空间，但是当我将窗口调整到较小的尺寸时，在某些时候，元素会耗尽空间。当发生这种情况时，我想将中间元素放到下一行。我有一个解决方案，其中第三个元素转到下一行，JSFiddle解决方案，其中第二个元素转到下一行，但总是在相同的静态宽度。

当所有三个收缩元素都用完空间时，是否可以将中间元素放到下一行？