title: Make children divs the height of tallest child
body: <p>I have two child <code>&lt;div&gt;</code> elements inside of a parent container <code>&lt;div&gt;</code> as shown:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="item"&gt;
          &lt;p&gt;Sup?&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="item"&gt;
          &lt;p&gt;Sup?&lt;/p&gt;
          &lt;p&gt;Wish that other guy was the same height as me&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I tried the following CSS:</p>
  
  <pre><code>.item {
      background: rgba(0,0,0,0.1);
      display: inline-block;
  }
  
  .row {
      border: 1px solid red;
  }
  </code></pre>
  
  <p>How can I get both children (<code>div.item</code>) to be the height of the tallest child?</p>
  
  <p>jsFiddle: <a href="http://jsfiddle.net/7m4f7/" rel="noreferrer">http://jsfiddle.net/7m4f7/</a></p>