I have a header table and a data table that need to match up. Currently, I am attempting to grab the first row of each table, get those cells, cycle over each cell, determine which width is the longest, and set the width of the other cell based on that. However, there is no change at all. The code is below and runs on document ready. Help?
function setHeaderLengths(){
var headers = document.getElementById("headersTbl").rows[0].cells;
var data = document.getElementById("dataTbl").rows[0].cells;
for (var i = 0; i < data.length; i++){
if(data[i].offsetWidth > headers[i].offsetWidth){
headers[i].style.width = data[i].offsetWidth;
}
else{
data[i].style.width = headers[i].offsetWidth;
}
}
}