css - Equal height rows with items need to be pushed to bottom -

i using bootstrap having 3 columns.

.row-eq-height {    display: -webkit-box;    display: -webkit-flex;    display: -ms-flexbox;    display:         flex;  }

using this link (just css added above) able columns equal heights. in smaller height column, have 3 rows. top 2 not rows, div.

bottom 1 class="row" because contents 2 columns class='col-lg-6'. want "row" (mentioned above) pushed bottom of page not happening. tried moving bottom adding position:absolute "row" distorted row feature(i mean distorted way col-lg-6 works). whats solution ?

here demo. please see in full screen.