Div placement problem in Firefox

[caffrinho]

Ok, not entirely sure if i'm in the right forum for this question, so let me know if there's a more appropriate place for it!

I have a few tables positioned around my website via div tags that are configured in a style sheet. The problem i am noticing is that, when using firefox, one of the tables doesn't align correctly. (It's fine in IE - I know, that doesn't say much!)

<div class="horizmen">
 <table id="hNav" cellspacing="0" cellpadding="0" border="0">
  <tr>

        <td>
            <img src="pics/start.jpg"

                 height="20" />
        </td>
        <td width="56">
            <a
               OnMouseOver="ypSlideOutMenu.showMenu('home');hideme();"
               OnMouseOut="ypSlideOutMenu.hideMenu('home');showme();">
                           <img src="pics/home.png"
                                alt="Home" />
            </a>
        </td>
        <td width="24">

            <img src="pics/btndiv.png"
                 width="24"
                 height="20" />
        </td>
        <td width="78">
            <a
               OnMouseOver="ypSlideOutMenu.showMenu('teams');hideme();"
               OnMouseOut="ypSlideOutMenu.hideMenu('teams');showme();">
                           <img src="pics/teams.png"
                                alt="Teams" />
            </a>
        </td>
        <td width="24">
            <img src="pics/btndiv.png"
                 width="24"
                 height="20" />

        </td>
        <td width="78">
            <a
               OnMouseOver="ypSlideOutMenu.showMenu('players');hideme();"
               OnMouseOut="ypSlideOutMenu.hideMenu('players');showme();">
                           <img src="pics/players.png"
                                alt="Players" />
            </a>
        </td>
        <td width="24">
            <img src="pics/btndiv.png"
                 width="24"
                 height="20" />
        </td>

        <td width="78">
            <a
               OnMouseOver="ypSlideOutMenu.showMenu('misc');hideme();"
               OnMouseOut="ypSlideOutMenu.hideMenu('misc');showme();">
                           <img src="pics/misc.png"
                                alt="Misc" />
            </a>
        </td>
        <td width="24">
            <img src="pics/btndiv.png"
                 width="24"
                 height="20" />
        </td>
        <td width="78">

            <a
               OnMouseOver="ypSlideOutMenu.showMenu('log');hideme();"
               OnMouseOut="ypSlideOutMenu.hideMenu('log');showme();">
                           <img src="pics/login.png"
                                alt="Log" />
            </a>
        </td>
        <td width="24">
            <img src="pics/btndivend.jpg"
                 width="24"
                 height="20" />
            </td>
        <td width="99%" background="pics/end.jpg">
        </td>

  </tr>
</table></div>

the css code is

.horizmen{position: absolute;
          left: 0px;
          top: 90px;
          width:800px;
          z-index:1;
          font-family: Tahoma, sans-serif;
          font-size: 10pt;
          color=#996600;
          }

.banner {position: absolute;
         left: 0px;
         top: 0px;
         width:100%;
         z-index:1;
         }

.maintable{position: absolute;
           left: 150px;
           top: 130px;
           width:500px;
           }

.vertmenu {position: absolute;
           left: 0px;
           top: 110px;
           width:100px;
           z-index:1;
           font-family: Tahoma, sans-serif;
           font-size: 10pt;
           color=#996600;
           }

All the other tables appear where i expect them to.
Are there any known problems/ any obvious mistakes that i can't find?

my website can be viewed at

http://www.ffleague.co.uk

I appreciate all help/guidance!

cheers

Caff

 

[BillyRayPreachersSon]

Your problem is the invalid syntax in the CSS file. Firefox is ignoring everything after it:

<!-- #B56D00 #FFDCA8 -->

It's hidden well offscreen in the line starting:

.menu {border:0px solid: #ffffff;}   /*Border around pop-up menu */

Comments in CSS files should ONLY be of the /* */ type.

Hope this helps,
Dan

 

[caffrinho]

Thanks a lot, Dan. Much appreciated.

although how you found it i will never know!!!!