Bootstrap 3 - make div inside column same height as the other columns on the same row.

As per the title, I've tried with making height:100% min-height:100% etc but it's not helping.

The following from similar questions make all columns into equal heights but I need the inside div stretch 100% to match the height of the other columns on the same row.

[class*="col-"]{
    margin-bottom: -99999px;
    padding-bottom: 99999px;
        background-color: red;
}
.row {
    overflow: hidden; 
}

Other columns contain images with img-responsive class so they resize automatically by the viewport size and this div in question will have mix of text and image.

Here is JS Fiddle