我如何让这些<a>适用于Firefox，而不仅仅是Internet Explorer 6

Question

这段代码仅适用于Internet Explorer 6，我不知道如何使其适用于Firefox。我正在使用包含表格行的超链接来更改页面上的内容。但是，在火狐浏览器上，链接变得无法点击...

这是 CSS：

#sidebar         {display:block; top:116px; left:11px; width:150px; position:fixed;}   
.sidebarLink     a:hover td { cursor:pointer; background-color:#f60;
                 color:#fff; border: 1px solid #f60;;}
.sidebarLink     td{background-color:#fff; color:#f60; border: 1px solid #ccc;;}
.sidebarLink     {font-family: sans-serif; font-weight: bold; font-size: small;} 

和 HTML：

<div id="sidebar">      
    <table style="table-layout: fixed; word-wrap: break-word border-collapse: collapse;" class="sidebarLink" cellpadding="5" cellspacing="4" width="150">
        <a href="index.php?test=table1"> 
            <tr align="middle">
                 <td>Link 1</td>
            </tr>
         </a>
         <a href="index.php?test=table2">
             <tr width="90" align="middle">
                 <td>Link 2</td>
             </tr>
         </a>
   </table>
</div>

我可以将其转换为带有按钮的表单，并设置按钮样式，使其看起来像我现在有桌子一样。问题是这会导致表本身和 onHover 功能出现性能问题，因此如果有人知道在 Firefox 中实现此功能的方法，那就太好了。

Answer 1

这完全是伪造的 HTML，我很惊讶它甚至可以在 IE6 中工作。 您不能只在表及其单元格之间放置任意元素。

看起来你根本不需要一张桌子？ 只需有两个链接（可能在列表中）并将它们display: inline-block;和width: 75px;。

顺便说一下，现在的浏览器比Firefox和IE6还多，而IE6现在必须处于流行阶梯的底部。 就连谷歌在几年前也基本上放弃了它。

Answer 2

为什么不做：

<div id="sidebar">      
    <table style="table-layout: fixed; word-wrap: break-word border-collapse: collapse;" class="sidebarLink" cellpadding="5" cellspacing="4" width="150">
            <tr align="middle">
                 <td><a href="index.php?test=table1"> Link 1</a></td>
            </tr>

             <tr width="90" align="middle">
                 <td><a href="index.php?test=table2">Link 2</a></td>
             </tr>
   </table>
</div>