Mouseover Script Doesn't Line Up Correctly In Firefox

[flyfisker]

I occasionally help out with this site that was built several years ago before firefox. It has an old script for a mouseover drop down menu that works fine in all browsers except firefox. In firefox the drop down menus don't line up correctly and pop out to the side. My question is, is there a quick fix to modify the script or the div tags to fix this problem or would I be better of building new drop down menus?

Thanks in advance.

Here is the site:
http://www.troutbum2.com

Here is the script:

<script language="JavaScript">

function show(object) {

  if (document.getElementById) {

    document.getElementById(object).style.visibility = 'visible';

  }

  else if (document.layers && document.layers[object]) {

    document.layers[object].visibility = 'visible';

  }

  else if (document.all) {

    document.all[object].style.visibility = 'visible';

  }

}



function hide(object) {	

  if (document.getElementById) {

    document.getElementById(object).style.visibility = 'hidden';

  }

  else if (document.layers && document.layers[object]) {

    document.layers[object].visibility = 'hidden';

  }

  else if (document.all) {

    document.all[object].style.visibility = 'hidden';

  }

}

Here is a div for one of the drop downs:

<div id="nav_flyshop" style="position:absolute; visibility:hidden; left:0px; top:324px; z-index:5;">

<table width="100%" align="center"><tr><td>

<table width="788" border="0" cellspacing="0" cellpadding="0" align="center">

    <tr> 

    <td width="36">&nbsp; </td>

    <td width="752"><div onMouseOver="show('nav_flyshop')" onMouseOut="hide('nav_flyshop')"><table width="102" border="0" cellspacing="0" cellpadding="0">

        <tr> 

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

          <td width="100" bgcolor="666666"><img src="images/spacer.gif" width="100" height="1" border="0"></td>

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

        </tr>

        <tr>

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

          <td background="images/nav_background.gif" class="nav"><a href="products.shtml" onMouseOver="show('nav_flyshop')" onMouseOut="hide('nav_flyshop')"><br>

            &nbsp;&nbsp;</a><a href="products.shtml">Products</a><br>

            &nbsp;&nbsp;<a href="TB2%20SummerNews%2006.pdf" target="_blank">Newsletter</a> 

            (pdf)<br>
            &nbsp;&nbsp;<a href="finding_tb2.shtml">Finding TB2</a><br>

            &nbsp;&nbsp;<a href="staff_profiles_chad.shtml">Staff Profiles</a><br>

			

			&nbsp;&nbsp;<a href="contact_tb2.shtml">Contact Us</a><br>

            &nbsp;&nbsp;<a href="helpful_links.shtml">Helpful Links</a><br> <br> </td>

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

        </tr>

        <tr> 

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

          <td width="198" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

          <td width="1" bgcolor="666666"><img src="images/spacer.gif" width="1" height="1" border="0"></td>

        </tr>

      </table></div></td>

  </tr>

</table></td></tr></table>

</div>

<div id="nav_guide" style="position:absolute; visibility:hidden; left:0px; top:324px; z-index:5;">

<table width="100%" align="center"><tr><td>

<table width="788" border="0" cellspacing="0" cellpadding="0" align="center">

 <tr> 

    <td width="168">&nbsp; </td>

[justinbarneskin]

I have ff 2.0.0.7 looks fine.
Sorry, can't help