Space between the last record and the horizontal scroll bar
Space between the last record and the horizontal scroll bar
tinker1123
Posts: 22Questions: 0Answers: 0
I've tried reducing the blank space between my last record and the horizontal scroll bar, but it doesn't seem to be working. I'm a CSS hack at best, so I am pasting a composite of the HTML generated by my JSP and throwing myself on the mercy of the court.
Thanks in advance for any help
Steve
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
acme: ACME Staff Directory
body
{
background-image:url('../images/bg-texture.gif');
background-color:white;
}
#container
{
margin-left:auto;
margin-right:auto;
text-align:center;
width: 99%;
/*background: white;*/
font-family:Arial,Helvetica;
font-size:10pt;
}
#content
{
clear: left;
padding: 20px;
text-align:center;
margin-left:auto;
margin-right:auto;
}
#results
{
margin-left:auto;
margin-right:auto;
margin-bottom: 50px;
width: 90%;
}
#results table
{
width: 600px;
font-size:10pt;
}
#results_table th
{
white-space: nowrap;
background:silver;
text-align:left;
font-size:10px;
}
#results td
{
white-space: nowrap;
text-align:left;
padding:5px;
border:5px solid white;
}
#note_id_results
{
font-size:8pt;
width: 100%;
padding-left:5%;
text-align:left;
}
<!-- Content: Start div content: Main content area -->
acme: PC: Results
$.fn.dataTableExt.oApi.fnUpdateLabelNumRecords = function ( oSettings )
{
$("#number_of_records_found").html(oSettings.fnRecordsTotal());
};
var usertype = "ProductionControl";
var number_of_records = "8";
var height = number_of_records * 40;
var height2 = null
var aoColumns = new Array();
var i = 0; // column number
if(height > 300)
height = 300;
height = height + "pt";
// Assign column properties to a column number taking into account that
// column numbering will change by usertype of the logged in user.
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "40px", "mDataProp": "person_id","bSortable":false};
i++;
}
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "50px", "mDataProp": "ID"};
}
else{
aoColumns[i] = {"sWidth": "50px", "mDataProp": "person_id"};
}
i++;
if(usertype != "Regular" && usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "40px", "mDataProp": "no_print"};
i++;
}
aoColumns[i] = {"sWidth": "200px", "mDataProp": "fullname"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "email_address"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "current_phone_number"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "ACME_org_title"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "office"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "ACME_position_title"};
i++;
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "100px", "mDataProp": "empl_code"};
}
$(document).ready(function() {
$('#results_table').dataTable( {
"bPaginate": true,
"bProcessing": true,
"bServerSide": true,
"sScrollY": height,
"bScrollCollapse":true,
"sScrollX": "600px",
"sServerMethod": "POST",
"sAjaxSource": "/acme/resultstable",
"aoColumns": aoColumns,
"fnDrawCallback": function(){this.fnUpdateLabelNumRecords();}
} );
} );
<!-- DataTables Ouput ( a table ) -->
<!--END: div id="results" -->
<!-- end form 'f', main form -->
<!-- Content: Close div id ="content" -->
<!-- end div container -->
[/code]
Thanks in advance for any help
Steve
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
acme: ACME Staff Directory
body
{
background-image:url('../images/bg-texture.gif');
background-color:white;
}
#container
{
margin-left:auto;
margin-right:auto;
text-align:center;
width: 99%;
/*background: white;*/
font-family:Arial,Helvetica;
font-size:10pt;
}
#content
{
clear: left;
padding: 20px;
text-align:center;
margin-left:auto;
margin-right:auto;
}
#results
{
margin-left:auto;
margin-right:auto;
margin-bottom: 50px;
width: 90%;
}
#results table
{
width: 600px;
font-size:10pt;
}
#results_table th
{
white-space: nowrap;
background:silver;
text-align:left;
font-size:10px;
}
#results td
{
white-space: nowrap;
text-align:left;
padding:5px;
border:5px solid white;
}
#note_id_results
{
font-size:8pt;
width: 100%;
padding-left:5%;
text-align:left;
}
<!-- Content: Start div content: Main content area -->
acme: PC: Results
$.fn.dataTableExt.oApi.fnUpdateLabelNumRecords = function ( oSettings )
{
$("#number_of_records_found").html(oSettings.fnRecordsTotal());
};
var usertype = "ProductionControl";
var number_of_records = "8";
var height = number_of_records * 40;
var height2 = null
var aoColumns = new Array();
var i = 0; // column number
if(height > 300)
height = 300;
height = height + "pt";
// Assign column properties to a column number taking into account that
// column numbering will change by usertype of the logged in user.
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "40px", "mDataProp": "person_id","bSortable":false};
i++;
}
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "50px", "mDataProp": "ID"};
}
else{
aoColumns[i] = {"sWidth": "50px", "mDataProp": "person_id"};
}
i++;
if(usertype != "Regular" && usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "40px", "mDataProp": "no_print"};
i++;
}
aoColumns[i] = {"sWidth": "200px", "mDataProp": "fullname"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "email_address"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "current_phone_number"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "ACME_org_title"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "office"};
i++;
aoColumns[i] = {"sWidth": "200px", "mDataProp": "ACME_position_title"};
i++;
if(usertype != "PublicUser"){
aoColumns[i] = {"sWidth": "100px", "mDataProp": "empl_code"};
}
$(document).ready(function() {
$('#results_table').dataTable( {
"bPaginate": true,
"bProcessing": true,
"bServerSide": true,
"sScrollY": height,
"bScrollCollapse":true,
"sScrollX": "600px",
"sServerMethod": "POST",
"sAjaxSource": "/acme/resultstable",
"aoColumns": aoColumns,
"fnDrawCallback": function(){this.fnUpdateLabelNumRecords();}
} );
} );
<!-- DataTables Ouput ( a table ) -->
<!--END: div id="results" -->
<!-- end form 'f', main form -->
<!-- Content: Close div id ="content" -->
<!-- end div container -->
[/code]
This discussion has been closed.