title: CSS inline-block uneven spacing
body: <p>So I have two columns of cards and each card has the <code>inline-block</code> property. Each is of variable height so there is uneven white space in between each card like so:</p>
  
  <p><a href="https://i.stack.imgur.com/XKORA.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XKORA.jpg" alt="inline-block"></a></p>
  
  <p>Short of having two separate columns, how can I get spacing between each card even?</p>
  
  <p>I'm aiming for this layout:</p>
  
  <p><a href="https://i.stack.imgur.com/2wmyg.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2wmyg.jpg" alt="enter image description here"></a></p>