I have a repeating data table like so (I know the php parts are far from correct in this case, but that's not the problem):
<table style="overflow:scroll" id="displayTable">
<tr>
<td>
<table id="DataTable">
<? php repeat>
<tr>
<td><? php echo $rowData['Column Name'];></td>
</tr>
<? php end repeat>
</table>
</td>
</tr>
</table>
I am after a way to make the overflow scrollable on the table. I have tried<div style="overflow:scroll"></div>
like shown above, but that doesn't work. I want it so that the overall height of the 'DataTable' table will be scrollable in the table cell of 'displayTable' that it is in.
Just wrap your table with an overflow:scroll
or overflow:auto
element with fixed height.
Markup
<div class="wrapper">
<table>
<tbody>
<tr>
<td>A Cell</td>
<td>A Cell</td>
<td>A Cell</td>
</tr>
<tr>
<td>A Cell</td>
<td>A Cell</td>
<td>A Cell</td>
</tr>
</tbody>
</table>
</div>
Style
.wrapper{
height:200px;
overflow:auto;
}