title: Semantic UI equal height columns
body: <p>I found "equal height" classes in Semantic UI, but I can't make inner div's the same heights ("ui segment" for example).
  More detail here .</p>
  
  <p><a href="http://jsfiddle.net/ozk615p6/34/" rel="nofollow noreferrer">http://jsfiddle.net/ozk615p6/34/</a></p>
  
  <p>Check my below Screenshots </p>
  
  <p><a href="https://i.stack.imgur.com/o9kwC.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/o9kwC.png" alt="enter image description here"></a></p>
  
  <pre><code>&lt;div class="ui container indent border shadow"&gt;
    &lt;div class="two column stackable ui grid "&gt;
      &lt;div class="equal height row"&gt;
        &lt;div class="column"&gt;
          &lt;h2 class="ui header center aligned "&gt;Lorem&lt;/h2&gt;
          &lt;div class="ui segment "&gt;
            &lt;div class="ui list "&gt;
              &lt;div class="item"&gt;
                &lt;i class="checkmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;
                  Lorem
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="xmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;
                  Lorem
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="column"&gt;
          &lt;h2 class="ui header center aligned "&gt;Lorem&lt;/h2&gt;
          &lt;div class="ui segment "&gt;
            &lt;div class="ui list"&gt;
              &lt;div class="item"&gt;
                &lt;i class="checkmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;
                  Lorem
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="checkmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="checkmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="xmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="xmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="xmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="item"&gt;
                &lt;i class="xmark icon"&gt;&lt;/i&gt;
                &lt;div class="content"&gt;Lorem&lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>