How to make product block for full height in Bootstrap 3

Question

How to make this code to be in full height (cms is OpenCart 2.1 and is using Bootstrap 3)?

<div class="row equal">
    <div class="product-layout product-grid col-lg-3 col-md-4 col-sm-6 col-xs-12">
        <div class="product-thumb">
            <div class="image"></div>
            <div class="caption"></div>
        </div>
    </div>
</div>

CSS

.row .equal {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

.equal > [class*='col-'] {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.equal > [class*='col-'] > * {
    display: flex;
    flex-wrap: wrap;
}

CSS doesnt make it full height

Currentl looks like this

Answer 1

Just find answear

CSS

.row .equal {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

.equal > [class*='col-'] {
  display: flex;
}

.equal > [class*='col-'] > * {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}