Click to See Complete Forum and Search --> : Misalignment of column widths


kopite
06-04-2003, 04:41 AM
Hi,

I have two tables whose columns are aligned, but when I make the first row not display in the second table - style.display= 'none'; - the columns between the two tables become misaligned.

I have tried setting the width of columns in the second table to the corresponding width of the columns in the first table, but it does not work (it changes the size but does not incorrectly), especially so when there are blank cells.

e.g.
document.getElementById(2ndtbl).rows[x].cells[i].style.width = document.getElementById(1sttbl).rows[x].cells[i].offsetWidth;

What js - I am using IE - can I use to ensure that they remain aligned.

Cheers!

Khalid Ali
06-04-2003, 08:09 AM
Some thing along the line should do it for you..The code below works in most browsers.


<style type="text/css">
td{
border:2px orange solid;
width:90pt;
height:90pt;
}
</style>
</head>
<body>
<table style="display:block;height:400pt;width:400pt;border:2px orange solid;background-color:#FFFFFF;" >
<tr >
<td >1</td>
<td style="visibility:hidden;">&nbsp;</td>
<td style="visibility:hidden;">&nbsp;</td>
</tr>
<tr>
<td style="visibility:hidden;">&nbsp;</td>
<td>3</td>
<td style="visibility:hidden;">&nbsp;</td>
</tr>
</table>