Carousel, make a div within an item same height as

I have an responsive Owl Carousel (v2), each item or slide has an image and below that some text of variable length, see image below:

As can be seen, all the images are bottom aligned to the same baseline, regardless of how much text there is. I've done this by setting the text div to a fixed height. The problem is, if there were to be just one line of text, I'd have unnecessary space below the carousel.

If I allow the div to set its own height, I get this:

So my images are no longer lined up.

HTML

    <div>
      <img class='a4_diary_image' src='sizes/test.png'>
      <div class='owl_diary_desc'>
        A4 size, this is going on to two lines
      </div>
    </div>

     <div>
      <img class='a5_diary_image' src='sizes/test.png'>
       <div class='owl_diary_desc'>
        A5 size 
      </div>
   </div>

    <div>
      <img class='a6_diary_image' src='sizes/test.png'>
       <div class='owl_diary_desc'>
        A6 size 
      </div>
   </div>

</div>

CSS

.owl-carousel .owl-item {
  display: table-cell;
  float: none;
  text-align: center;
  vertical-align: bottom;
  border: 1px dashed grey;
  height: 100%;
  padding: 0px 10px;
}


.owl_diary_desc {
  font-size: 19px;
  border: 1px dashed red;
  margin-top:10px;
}




.a4_diary_image {
  max-width: 100%;
  max-height: 100%;
  margin-left: auto;
  margin-right: auto;
}


.a5_diary_image {
  max-width: 70%;
  max-height: 70%;
  margin-left: auto;
  margin-right: auto;
}


.a6_diary_image {
  max-width: 50%;
  max-height: 50%;
  margin-left: auto;
  margin-right: auto;
}

Straight HTML and CSS won't allow you to set equal heights based off siblings. Using a little jquery this can be achieved though.

$maxDesc;
function equalize(){
    $('.owl_diary_desc').each(function(i){
        if ($(this).height() > $maxDesc) { $maxDesc = $(this).height();}
    });

    $('.owl_diary_desc').each(function(i){$(this).height($maxDesc);});
}

When I use something like this, I generally move the variable holder to the beginning of the script. Then I call the function on document ready. Sometimes I'll even call it on the window resize function. If you choose to do that, you must call an each function on your object and reset the height to auto before recalling the equalize function.