That’s correct, we hate those gaps — the pattern we are after basically is just “2 columns for desktop, 1 column for mobile”. The children are fixed in number, they are just elements in our “account” page, “settings” page, one other page.
So I think we could just do a mega-parent that is arranged left-to-right which contains two parent containers that are arranged top to bottom. We then set the mega parent to wrap, so when the device is small the two parent columns are stacked on top of each other.
Anyway, thank you very much for helping me to understand the difference between Flexbox behavior for vertical vs. horizontal… it’s all about the fact that users are generally familiar with vertical scrolling, but doing horizontal scroll is unusual.