title: Is it possible to make the div the same height as images in a row in Bootstrap
body: <p>I am using the "row" class from bootstrap and I have two images and a div which contains some text.  Here is an example here: <a href="http://notionfresh.com/testsite/" rel="nofollow">http://notionfresh.com/testsite/</a></p>
  
  <p>My aim is to make all the elements in the row the same height.  Is there any way I can achieve this using in the given example?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.colly {
   margin-bottom: 20px;
  }
  
  .colly2 {
   margin-bottom: 20px;
  }
     
  .pclass {
   padding: 20px;
  }
  
  .textbox {
   height: auto;
      min-width: 270px;
      background: #000;
      font-size: 15px;
      font-style: oblique;
      color: #FFF;
      text-align: center;
   margin: 0 auto;
      display: table-cell;
      vertical-align: middle;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Portfolio&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
   &lt;!-- Bootstrap --&gt;
   &lt;link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"&gt;
   &lt;link href="custom.css" rel="stylesheet"&gt;
   &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet" /&gt;
   &lt;script type="text/javascript" src="https://code.jquery.com/jquery-1.11.2.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/js/lightbox.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
      &lt;div class="row"&gt;
      &lt;div class="colly col-lg-4 col-md-4 col-sm-6"&gt;
      &lt;a href="img/portfolio_2.png" &gt;&lt;img src="img/portfolio_2.png" class="img-responsive img-home-portfolio"/&gt;&lt;/a&gt;
            &lt;/div&gt;
            &lt;div class="colly col-lg-4 col-md-4 col-sm-6"&gt;
      &lt;a href="img/portfolio_3.png" &gt;&lt;img src="img/portfolio_3.png" class="img-responsive img-home-portfolio"/&gt;&lt;/a&gt;
            &lt;/div&gt;
            &lt;div class="colly2 col-lg-4 col-md-4 col-sm-6"&gt;
      &lt;div class="textbox"&gt;
      &lt;p class="pclass"&gt;Sed cursus libero a risus molestie, vitae lobortis mi aliquam. Curabitur euismod velit risus, et scelerisque elit rhoncus quis. Integer semper lorem quis nisl viverra, nec egestas massa rhoncus. In vitae eros accumsan, commodo tellus at, volutpat neque. Sed rutrum, justo quis congue dictum, odio risus imperdiet nunc, sit amet laoreet nibh ex id tortor. Proin a pretium ipsum. Ut fermentum urna at lobortis interdum.&lt;/p&gt;
      &lt;/div&gt;
     &lt;/div&gt;
          &lt;/div&gt;&lt;!-- /.row --&gt;
    
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>