Here I want horizontal scroll for table with id "datavaulttable" I have tried with overflow-x
and display:block
property but it is not working, while specifying overflow-x
property I also set width property like width:200px
still it not working.
<body style="overflow-y: scroll; height: 100px">
<div>
<table id="tbluserfolder">
<tr>
<td>
<button id="addbutton" class="btn"
style="background-color: lightgray" onclick="folderInfo()">
<img src="/BoardUI/img/plussign.jpg" height="50px" width="50px" />
Add Folder
</button>
</td>
</tr>
</table>
<table class="foldertable table-bordered" id="datavaulttable" >
<!--
table-striped
<thead>
<tr>
<th>File</th>
<th>Created On</th>
<th>Created By</th>
</tr>
</thead> -->
</table>
<table class="table table-striped table-bordered" id="fileinfo">
<thead>
<tr>
<th>File</th>
<th>Created On</th>
<th>Created By</th>
</tr>
</thead>
</table>
</div>
</body>
i just added div tag , wrapped table with div
<div style="overflow-x: scroll; width: 99%">
<table class="table table-bordered" id="datavaulttable">
<!--
table-striped
<thead>
<tr>
<th>File</th>
<th>Created On</th>
<th>Created By</th>
</tr>
</thead> -->
</table>
</div>