<html> <head>
<style> table#headers {table-layout:fixed;background:#eea033;} table#data {table-layout:relative;background:#eea033;} td, th {vertical-align:top;background:#ffffff;} </style> <script language="javascript"> var rh; var fr; var ds; var hs;
function syncScroll(e) { hs.scrollLeft = ds.scrollLeft; }
function syncResize(e) { hs.style.width = ds.offsetWidth-(ds.offsetWidth - ds.clientWidth);
for( i =0; i < rh.childNodes.length; i++ ) { rh.childNodes[i].width = fr.childNodes[i].offsetWidth; } }
function init() { rh = document.getElementById("rh"); fr = document.getElementById("fr"); ds = document.getElementById("ds"); hs = document.getElementById("hs");
hs.style.top = ds.offsetTop; hs.style.left = ds.offsetLeft; hs.style.visibility = 'visible'; ds.onscroll=syncScroll; window.onresize=syncResize; syncResize(); }
</script>
</head>
<body onload='init();'> <div style="width:90%;overflow:hidden;z-index=3;visibility:hidden;position:absolute;" id='hs'> <table cellpadding="0" cellspacing="1" id="headers"> <tr id='rh'> <th>col1</th> <th>col2</th> <th>col3</th> <th>col4</th> <th>col5</th> <th>col6</th> <th>col7</th> <th>col8</th> <th>col9</th> <th>col10</th> </tr> </table> </div> <div style="width:90%;height:200px;overflow:auto;z-index=2;" id='ds'> <table cellpadding="0" cellspacing="1" width="100%" id="data"> <tr id='fr'> <th>col1</th> <th>col2</th> <th>col3</th> <th>col4</th> <th>col5</th> <th>col6</th> <th>col7</th> <th>col8</th> <th>col9</th> <th>col10</th> </tr> <tr> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>thisisawidthtest-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> </tr> <tr> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> </tr> <tr> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> <td>this is a width test-- please tell me it works</td> </tr> </table> </body> </html>

|