JSFiddle - React, Tailwind, and code Playground
HTML
<table class="table" style="margin:0;">
<tr>
<th width="10%" style="border-top:0;">Id</th>
<th style="border-top:0;">Text</th>
<th width="10%" style="border-top:0;">Data</th>
</tr>
</table>
<div class="data">
<table class="table table-striped">
<tr>
<td width="10%">12.1.124.144</td>
<td class="slide"><div>testing updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updates</div></td>
<td width="10%">2014-02-02 18:01:14</td>
</tr>
<tr>
<td width="10%">12.1.124.144</td>
<td class="slide"><div>testing updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updates</div></td>
<td width="10%">2014-02-02 18:01:14</td>
</tr>
<tr>
...
CSS
body {
scrollbar-face-color: #DDD;
background-size:cover;
border-top:5px solid #000000;
background:#ebe8de;
}
.data {
height: 50%;
overflow: scroll;
overflow-x: hidden;
}
.data td div {
width: 500px;
}
.slide div{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
JavaScript
$(".slide div").click(function () {
$(this).parent().toggleClass('slide');
});