JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<body>
<nav data-offset-top="68" id="top-clients-office-nav">
<ul class="nav">
<li class="active" role="presentation"><a href="#new-york">New York</a>
</li>
<li role="presentation"><a href="#chicago">Chicago</a>
</li>
<li role="presentation"><a href="#los-angeles">Los Angeles</a>
</li>
<li role="presentation"><a href="#firm">Firm</a>
</li>
</ul>
</nav>
<div data-spy="scroll" data-target="#top-clients-office-nav" style="position:relative;">
<div id="new-york" class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">New York</h2>
</div>
<div class="panel-body">
<table class="table table-hover table-condensed table-striped">
<thead>
<tr>
<th>Parent Client</th>
<th class="text-right">YTD</th>
<th class="text-right">Hours</th>
<th class="text-right">YTD Hours</th>
</tr>
</thead>
<tbody>
<tr>
<td>Test</td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>Test</td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>Test</td>
<td>1</td>
...