Grab the column borders and drag 'em! Bonus: refresh the page.

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry the Bird		@twitter

<script src="/path/to/jquery.js"></script>
<script src="/path/to/store.js"></script>
<script src="/path/to/jquery.resizableColumns.js"></script>

<table class="table table-bordered" data-resizable-columns-id="demo-table">
<thead>
  <tr>
    <th data-resizable-column-id="#">#</th>
    <th data-resizable-column-id="first_name">First Name</th>
    <th data-resizable-column-id="last_name">Last Name</th>
    <th data-resizable-column-id="username" data-noresize>Username</th>
  </tr>
</thead>
<tbody>
  ...
</tbody>
</table>

<script>
$(function(){
  $("table").resizableColumns({
    store: window.store
  });
});
</script>