Column Header widths in IE6

eyre.michael

I am working a site that need to use IE6. The table that I have has both X scrolling and Y scrolling. When the table is displayed, the column headers are not aligned with the table rows. This works fine in FF, but not IE6. Unfortunately, I need to make sure it is working in IE6.

I am guess that there is an issue with CSS, but I am not able to figure it out.

Thanks

Mike

eyre.michael

Does anyone have any ideas about a solution for this?

allan

Can you give us a link to the page that isn't working please? Also does this page work okay for you: http://datatables.net/examples/basic_init/scroll_xy.html ?

Allan

eyre.michael

Unfortunately, the link is to an internal site. I will try and figure out a way to send the link. The example page does look correctly in IE6. It seems that the data row widths are bigger than the header widths and even setting the sWidth value for a column does not change the widths on either the header or the data.

The problem is only with IE6, for Firefox or Chrome.

eyre.michael

So I can't send you the full file, since it contains proprietary data, but here is the code for the datatable:
[code]



$(document).ready(function() {

// Define the alarm table datatable parameters
_resultTable = $('#result-table').dataTable({
sScrollY: "400px",
bPaginate: false,
bAutoWidth: false,
oLanguage: {
sSearch: "Search:",
sZeroRecords: "No results match the criteria",
sInfo: "Grid contains _TOTAL_ entries"
},
aaData: [***array of column values ***],
sScrollX: "100%",
sScrollCollapse: true,
bSort: true,
aoColumns: [
{ bSearchable: false,
bVisible: false
},
null,
{ sWidth: "200px",
sSortDataType: "dom-text",
sType: "date-NNN-time"},
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
null
]
});

_resultTable.fnAdjustColumnSizing();
_resultTable.fnDraw();

});


[/code]

eyre.michael

I did some more work on this and I got it to work in IE6. It seems that the data in the body of the table was wrapping at a different point than the header. The original header was "Sample Date Time", so it was wrapping at each space. I changed the to be "Sample Date Time" and it did not wrap the text at all and all of the columns were aligned correctly. This also worked on all of the different browsers.

eyre.michael

So I am back to having problems with IE6 and column header widths.

I needed to make a change to a table width and after I made it smaller the column headers do not match the table body column widths for some of the columns. This problem is only with IE6, but I need to get it to work there.

I have bAutoWidth set to false and a few of the column widths are specified with the sWidth parameter, but they seem to be ignored. I do not have the parameters in double quotes, but I will test it with that change.

Any help would be greatly appreciated. Thanks