响应式布局，一列到两列，元素重新排序（仅CSS）

Question

我想创建一个响应式布局，其中移动版本为一列，宽版本为两列。移动版本的框将具有一个顺序，而桌面版本的框将具有不同的顺序（请参见下文）。盒子的高度可以不同（内容可能因上下文而异）。

我只想使用CSS和Media查询。我尝试了浮子和网格，但是没有东西会给我这个。任何帮助表示赞赏。