Bootstrap 3 + AngularJS - Modal example

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<div ng-controller="MainCtrl" class="container main">
<table class="table table-bordered">
  <tbody>
    <tr>
        <td></td>
        <td rowspan="100">
          <div class="wrapper">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th ng-repeat="date in dates">
                    {{ date }}
                  </th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="user in users">
                  <td ng-repeat="date in dates"></td>
                </tr>
              </tbody>
            </table>
          </div>
        </td>
    </tr>
    <tr ng-repeat="user in users">
      <td>{{ user }}</td>
    </tr>
  </tbody>
</table>
</div>

CSS

.main {
  overflow: hidden;
}

.main > table {
}

.wrapper {
  border: 1px solid blue;
  width: 500px;
  overflow-x: scroll;
}

.wrapper > table > thead > tr:first-child > th {
  border-bottom: 0;
}

.wrapper > table > tbody > tr > td:first-child {
  border-left: 0;
}

td {
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
}

table {
  margin: 0 !important;
  padding: 0 !important;
}

JavaScript

var mymodal = angular.module('mymodal', []);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.users = [];
    $scope.dates = [];
    
    for (var i = 1; i < 50; i++) {
    	$scope.users.push('user' + i);
    }
    
    for (var i = 1; i < 50; i++) {
    	$scope.dates.push(i);
    }
  });