Datatable doesn't work in twentysixteen wordpress theme.
Datatable doesn't work in twentysixteen wordpress theme.
samuelk2019
Posts: 15Questions: 5Answers: 0
Hi,
We have built a web-site using twentysixteen wordpress theme.
I have created a sample page with html content as below
The below html works fine when i saved in my local system and browse via chrome. However the same datatable is not rendering properly when i inserted in the word press page.
Please kindly help me on how to resolve this.
<head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-2.2.3/dt-1.10.12/r-2.1.0/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-2.2.3/dt-1.10.12/r-2.1.0/datatables.min.js"></script>
<script>
$(document).ready(function() {
var table = $('#example').DataTable( {
scrollY: 300,
paging: false
} );
} );
</script>
<style>
div.container { max-width: 1200px }
</style>
</head>
<table id="example" class="display responsive nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>First name</th>
<th>Last name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
<th>Extn.</th>
<th>E-mail</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
<td>Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
<td>5421</td>
<td>t.nixon@datatables.net</td>
</tr>
.....
......
</tbody>
</table>
Thanks
This discussion has been closed.
Answers
Please follow the forum rules and not post duplicates. Also requested in the forum rules is that you post a link to a test case showing the issue.
Allan
The problem is due to conflicting css between theme's css and datatable's css. Not found any solution yet. We need to overwrite the css.
I've already requested that you please don't post duplicate questions. Closing this thread in favour of this one.
Allan