div items fill horizontal gaps

There are some items in a div. I've used flex and flex-wrap to create some kind of metro view. But some items are taller than others, producing some empty gaps. These items have a fixed width. I need to fill the empty gaps, shown in the picture. How can this be done?

<div class="flex flex-wrap">
  <div class="w-1/3">Content</div>
  <div class="w-1/3">Content</div>
  <div class="w-1/3">Content</div>
  <div class="w-1/3">Content</div>
  <div class="w-1/3">Content</div>
  <div class="w-1/3">Content</div>
</div>