Fixing the data table width

meetzbachi

Hi
I am using the jquery data table to display the data. I am bale to display the large data using server side scripting on data table.
When i am displaying the data, automatically IE scroll bar is coming and table is displaying in more than the screen. I want to fix the data table in one page and display the scroll bars inside the data table instead of IE. Can somebody please help me to resolve this issue. I have tried with sScrollY property but the heading of the data table is not alligning with the data. I am using the data table properties as below:

$(function() {
table = $('#datagrid').dataTable({
"bProcessing" : true,
"bServerSide" : true,
"bScrollCollapse": true,
"sPaginationType": "full_numbers",
"bPaginate" : true,
"bLengthChange" : true,
"bFilter" : true,
"bSort" : true,
"sDom": "Rlfrtip",
"bInfo" : true,
"bAutoWidth" : false,
"oTableTools": {
"sRowSelect": "multi"
},
"sScrollY":"200px",
"sAjaxSource" :"ServerSide.jsp",
"deferRender": true ,
"aoColumnDefs": [{ 'bSortable': false,"width": "10%",'aTargets': [ 0 ] } ] ,
"oLanguage": {"sInfo": "Records from (START to END) of TOTAL entries ",
"infoFiltered": "(filtered from MAX total records)" } ,
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "name", "value": "<%=request.getParameter("name")%>" }
);
}
});
});

Some one please help me to resolev this issue?