具有柔性宽度对齐元素的网格

Question

我一直在尝试制作一个包含一组灵活元素的响应式网格布局，而不必为每个宽度顺序放置媒体查询。 基本上，这里是＆＃34;规则＆＃34;网格：

• 元素具有最小宽度，但能够占用可用空间
• 布局会在一行中放置尽可能多的元素。剩下的空间将分成各个元素。
• 最后一个元素（在最后一个和可能未填充的行上）与前一行的元素具有相同的宽度。

I managed to do one system that nearly works with flexbox。
唯一的问题是最后一个元素占用了所有可用空间，而不是与前面的元素对齐。

#b {
    border: 1px solid black;

    display: flex;
    flex-wrap: wrap;
}

#b div {
    border: 1px solid red;

    flex-grow: 1;
    flex-basis: 200px;
    display: inline-block;

}

有没有办法只用CSS做到这一点？
提前谢谢！