JSFiddle - React, Tailwind, and code Playground

by kapantzak

HTML

<table>
    <tbody>
        <tr>
            <td>
                <div class="title">title1<br/>test<br/>test test</div>
                <div class="img"><img src="http://icdn.pro/images/en/r/e/red-square-icone-9457-96.png" /></div>
                <div class="descr">description</div>
            </td>
            <td>
                <div class="title">title2<br/>test</div>
                <div class="img"><img src="http://icdn.pro/images/en/r/e/red-square-icone-9457-96.png" /></div>
                <div class="descr">description</div>
            </td>
            <td>
                <div class="title">title3</div>
                <div class="img"><img src="http://icdn.pro/images/en/r/e/red-square-icone-9457-96.png" /></div>
                <div class="descr">description</div>
            </td>
        </tr>        
    </tbody>
</table>

CSS

table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}

td {
    border: 1px solid #ccc;
}

JavaScript

var heightAr = [];
var titleDiv = $('div.title');
titleDiv.each(function() {
    var height = $(this).css('height').replace('px', '');
    heightAr.push(height);
});
var greatest = Math.max.apply( null, heightAr );
titleDiv.css({'height':greatest + 'px'});