Skip to content

Additional Scroll Bar Below the Header of JQuery Datatable

I am using Datatables (Jquery).

Using the code i am getting a horizontal Scroll bar above my footer of the table as in the Link :

 "sScrollX": "100%",
 "sScrollXInner": "120%",
 "bScrollCollapse": true,

Now i want to get another Scroll Bar below the Header also. Help me out.

Answer

For this you have to add another container which has a fixed width like 1000px with overflow auto. And if the content overflows by 1000px then you will able to show the scroller in the container

Like:

CSS

.newcontainer{width:1000px;overflow:auto;}

HTML

<div class="newcontainer">
    <!-- Your div having the datatable-->
</div>