title: Blocks side-by-side with the same height
body: <p>OK, what I need is fairly simple, though it's one of those things that I've never managed to get my head around when using CSS. So, here I am...</p>
  
  <ul>
  <li><p>I'm using a custom template, built around Twitter Bootstrap.</p></li>
  <li><p>This template features a section (declared as <code>span6 row</code>), containing small blocks (declared as <code>span3</code>). In the end, the sub-blocks form rows (2 blocks per row).</p></li>
  </ul>
  
  <hr>
  
  <p><strong>Here's a visual example :</strong></p>
  
  <p><img src="https://i.stack.imgur.com/SSP7K.jpg" alt="enter image description here"></p>
  
  <p>The result <em>is</em> ok, though I'd still need one thing :</p>
  
  <p><strong>HOW do I make sure that 2 adjacent blocks have the exact same height?</strong> (e.g. The 1st block - <em>"Some title here"</em> - and the 2nd block - <em>"Awesome work"</em> - white rectangles being of the exact same height, no matter what the contents are... (much like the 2 last blocks)).</p>
  
  <p>Any ideas?</p>
  
  <hr>
  
  <p><strong>P.S.</strong> </p>
  
  <ol>
  <li>Please let me know, in case you need to know anything else about the "inner" structure.</li>
  <li>I'm pretty sure it may have to do with "clear" fixes, etc - but to be honest I've never actually understood the... magic behind the trick... :(</li>
  </ol>