Hello dear DNN Users,

I am working on a DNN website at the moment and am using the inventua Topmenu and the Inventua Sidemenu for Navigation.
I managed to make the skin work as intended on the Internet explorer but the Topmenu keeps looking messed up in Firefox. It seems it completely ignores certain css styles.
Moreover Firefox does not include the spacer in between the menu items, even though Internet explorer does without problems.
I cannot give you the Link because the Website is to be kept private until release but maybe you can spot a mistake in the css styles or the skin code i pasted below.

Skin Code:

<div align="center">
 <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/menutopbg.jpg" height="33" id="table3" valign="middle">
  <tr>
   <td>
   <div align="center" valign="middle">
    <table border="0" cellspacing="0" cellpadding="0" id="table8" height="27">
     <tr>
      <td width="3" background="img/topmenu-spacer.png" style="background-repeat: no-repeat; background-position: top right;"></td>
      <td valign="middle">[INVTOPMENU]</td>
      <td width="3" background="img/topmenu-spacer.png" style="background-repeat: no-repeat; background-position: top left;"></td>
     </tr>
    </table>
   </div>
   </td>
  </tr>
 </table>
</div>

The XML code for the Topmenu is:

<Object>
     <Token>[INVTOPMENU]</Token>
      <Settings>
 <Setting>
         <Name>MenuBarCssClass</Name>
         <Value>TMenuBar</Value>
       </Setting>
       <Setting>
         <Name>MenuItemCssClass</Name>
         <Value>TMenuItem</Value>
       </Setting>
       <Setting>
         <Name>MenuHighlightCssClass</Name>
         <Value>TMenuHighlight</Value>
       </Setting>
       <Setting>
         <Name>CurrentItemCssClass</Name>
         <Value>TMenuCurrent</Value>
       </Setting>
       <Setting>
         <Name>UseName</Name>
         <Value>true</Value>
       </Setting>
       <Setting>
         <Name>Seperator</Name>
         <Value>&lt;span class="tmenuspacer" width="6"&gt;&lt;/span&gt;</Value>
       </Setting>
      </Settings>
    </Object>

And finally the CSS code for the Topmenu:

.tmenuspacer
{
 background-image: url(img/topmenu-spacer.png);
 background-repeat: no-repeat;
 height: 27px;
 width: 6px;
 vertical-align: middle;
}

.TMenuBar
{
 height: 27px;
 vertical-align: middle;
 color: #fff;
}

.TMenuItem
{
 background-image: url(img/topmenu-item.png);
                color: #fff;
 background-repeat: repeat-x;
 vertical-align: middle;
 height: 27px;
}

.Link
{
                color: #fff;
                height: 27px;
                cursor: hand;
                vertical-align:middle;
                position: relative; top: 0px;
 padding: 5px 5px 5px 5px;
}

.TMenuItem A, .TMenuItem A:Link .TMenuItem A:Hover,
.TMenuItem A:Active, .TMenuHighlight A, .TMenuHighlight A:Link, .TMenuHighlight A:Hover, .TMenuHighlight A:Active, .TMenuCurrent A, .TMenuCurrent A:Link, .TMenuCurrent A:Hover, .TMenuCurrent A:Active, .TMenuBar A, .TMenuBar A:Hover, .TMenuBar A:Link, .TMenuBar A:Active
{
 color: #fff;
}

.TMenuHighlight
{
 background-image: url(img/topmenu-hover.png);
 background-repeat: repeat-x;
 vertical-align: middle;
 height: 27px;
 color: #fff;
}
.TMenuCurrent
{
 background-image: url(img/topmenu-current.png);
 background-repeat: repeat-x;
 color: #fff;
                cursor: hand;
 height: 27px;
 padding: 5px 5px 5px 5px;
 position: relative; top: 0px;
}

I found out there was a mysterious style called .Link which overwrote my styles for the Topmenu so i just added .Link to my css file and made my own settings for it.
As i said, everything works fine in IE, but Firefox cant display it correctly.
I would really appreciate it if you could help me out with this one since i have a deadline for the Page on January the 15th and this display bug in Firefox is the only issue i have left with the page.

Kind regards

Peter Walker