JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="panel panel-info">
 <div class="panel-heading">
 <h3 class="panel-title">My Title</h3>
 </div>
    <div class="panel-body">
        <div class="table-container">
           <table class="table table-hover table-striped table-condensed table-responsive">
           <thead>
             <tr>
             <th>Column One</th>
             <th>Column Two</th>
             <th>Column Three</th>
             </tr>
           </thead>
           <tbody>
             <tr><td>A</td><td>B</td><td>C</td></tr>
             <tr><td>D</td><td>E</td><td>F</td></tr>
             <tr><td>G</td><td>H</td><td>I</td></tr>
             <tr><td>J</td><td>K</td><td>L</td></tr>
             <tr><td>M</td><td>N</td><td>O</td></tr>
             <tr><td>P</td><td>Q</td><td>R</td></tr>
             <tr><td>S</td><td>T</td><td>U</td></tr>
             <tr><td>V</td><td>W</td><td>X</td></tr>
             <tr><td>Y</td><td>Z</td><td>AA</td></tr>
             <tr><td>A</td><td>B</td><td>C</td></tr>
             <tr><td>D</td><td>E</td><td>F</td></tr>
             <tr><td>G</td><td>H</td><td>I</td></tr>
             <tr><td>J</td><td>K</td><td>L</td></tr>
             <tr><td>M</td><td>N</td><td>O</td></tr>
             <tr><td>P</td><td>Q</td><td>R</td></tr>
             <tr><td>S</td><td>T</td><td>U</td></tr>
             <tr><td>V</td><td>W</td><td>X</td></tr>
            ...

CSS

.table-container {
   height: 175px;
    border-bottom: 2px solid #EEEEEE;
    overflow-y: auto;
 position: relative;
}

        .ui-resizable-handle {
    width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid gray;


}

        .ui-resizable-s
{
    left: 50%;
    position: absolute;
}

JavaScript

$(function () {

$(".table-container").resizable({ handles: "s", resize: updateHandle });

$( ".table-container" ).scroll(function() {
	updateHandle();
});

	updateHandle();

});

function updateHandle() {
	table = $('.table-container');
	var bottom =  table.scrollTop() + table.outerHeight(true) - $('.ui-resizable-handle').outerHeight() - 5;
	$('.ui-resizable-handle').css('top', bottom + 'px');
}