Hiding a table row in Netscape

NeffTribe · Feb 15, 2002

In IE I have not trouble setting the style's display property to "none" or "inline" to hide and display a row of a table. In Netscape 6.x the contents of the row are hidden but the row doesn't collapse. When I set it back to "inline" the contents are displayed but the row height stretches.

Here's a very simple sample (click 'switch'):
-----------------
<html>
<head>
</head>

<script language="javascript" type="text/javascript">
function switchIt(id)
{
o=document.getElementById(id);
o.style.display = o.style.display == 'inline'?'none':'inline';
}
</script>

<body>

<div onclick="javascript:switchIt('details')">Switch</div>

<table border=1>
<tr id="details" style="display:inline">
<td bgcolor="cccccc" > hello </td>
</tr>
</table>

</body>
</html>
-----------------

Is there another way to do this?

Thanks,

-David

Raver1 · Feb 21, 2002

Hey NeffTribe,

NS6 bugs? Using 'display' is pretty new for Netscape, so try setting 'display' to '', not 'inline'. This will work the same (on your example) for both IE and NS6.

I provided an example below:

<html>
<head>
</head>

<script language="javascript" type="text/javascript">
function switchIt(id)
{
o=document.getElementById(id);
o.style.display = o.style.display == ''?'none':'';
}
</script>

<body>

<div onclick="javascript:switchIt('details')">Switch</div>

<table border=1>
<tr id="details">
<td bgcolor="cccccc" > hello </td>
</tr>
</table>

</body>
</html>

Try it and see what happens,

Raver1

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Hiding a table row in Netscape

NeffTribe

Programmer

Raver1

Programmer

Similar threads

Part and Inventory Search

Sponsor