Firefox和IE8中的CSS表格单元填充问题

我有一些严重的问题试图调整我的表格布局。在Firefox中，我得到了奇怪的顶部/底部填充与所有文本不一致的地方。在Firefox和IE8中，我似乎都无法让我的图标垂直居中显示在单元中。Firefox和IE8中的CSS表格单元填充问题

见如下：

alt text http://www.graphicsdistrict.com/css-issue.png

这里是我的表CSS：

table.maxwidth { 
    width: 100%; 
} 

table.standard th { 
    color: white; 
    font: bold 0.85em Century Gothic; 
    padding: 0.6em; 
    background-color: #424E4F; 
} 

table.standard td { 
    padding: 0.2em 0.5em; 
} 

table.standard tr + tr > td { 
    border-top: 1px dotted #ccc; 
} 

table.standard th + th { 
    border-left: 1px solid white; 
} 

table.standard td + td { 
    border-left: 1px dotted #ccc; 
} 

table.standard > tfoot > tr > td { 
    border-top: 0.18em solid #424E4F; 
    padding: 0.2em 0.5em; 
} 

table.striped tr.alt td { 
    background-color: #eee; 
} 

table.hover tr:hover td { 
    background-color: #e0e0e0; 
}

这里是我的表HTML：

<table class="standard maxwidth striped hover"> 

    <thead> 
     <tr> 
      <th class="left">Accessory</th> 
      <th class="center">Available</th> 
      <th class="right">Options</th> 
     </tr> 
    </thead> 

    <tbody> 

     <tr> 
      <td class="label"><a href="/mss/Accessory/Edit/4">Mains Charger</a></td> 
      <td class="center"> 

      <img src="/mss/Static/images/icons/tick.png" /></td> 
      <td class="right"> 
      <a href="/mss/Accessory/Archive/4" onclick="if(!confirm('Are you sure you want to archive this Accessory?')) return false;">Archive</a> 
      /<a href="/mss/Accessory/Delete/4" onclick="if(!confirm('Are you sure you want to delete this Accessory?\nRelated historical data and reports will be affected!')) return false;">Delete</a> 

      </td> 
     </tr> 

     <tr> 
      <td class="label"><a href="/mss/Accessory/Edit/3">Bluetooth Headset</a></td> 
      <td class="center"> 

      <img src="/mss/Static/images/icons/tick.png" /></td> 
      <td class="right"> 
      <a href="/mss/Accessory/Archive/3" onclick="if(!confirm('Are you sure you want to archive this Accessory?')) return false;">Archive</a> 

      /<a href="/mss/Accessory/Delete/3" onclick="if(!confirm('Are you sure you want to delete this Accessory?\nRelated historical data and reports will be affected!')) return false;">Delete</a> 
      </td> 
     </tr> 

     <tr> 
      <td class="label"><a href="/mss/Accessory/Edit/2">Car Kit</a></td> 
      <td class="center"> 

      <img src="/mss/Static/images/icons/tick.png" /></td> 

      <td class="right"> 
      <a href="/mss/Accessory/Archive/2" onclick="if(!confirm('Are you sure you want to archive this Accessory?')) return false;">Archive</a> 
      /<a href="/mss/Accessory/Delete/2" onclick="if(!confirm('Are you sure you want to delete this Accessory?\nRelated historical data and reports will be affected!')) return false;">Delete</a> 
      </td> 
     </tr> 

     <tr> 
      <td class="label"><a href="/mss/Accessory/Edit/1">Leather Phone Case</a></td> 

      <td class="center"> 

      <img src="/mss/Static/images/icons/tick.png" /></td> 
      <td class="right"> 
      <a href="/mss/Accessory/Archive/1" onclick="if(!confirm('Are you sure you want to archive this Accessory?')) return false;">Archive</a> 
      /<a href="/mss/Accessory/Delete/1" onclick="if(!confirm('Are you sure you want to delete this Accessory?\nRelated historical data and reports will be affected!')) return false;">Delete</a> 
      </td> 
     </tr> 


    </tbody> 
    <tfoot> 
     <tr> 
      <td colspan="3"><a href="/mss/Accessory/New">Add an Accessory</a></td> 
     </tr> 
    </tfoot> 
</table>

注意，前间距和/或者在单元格的内容似乎不影响该问题之后正面或负面。

编辑

更改CSS使用像素单位代替EM修复左栏文本慢跑，但并没有解决图像垂直居中的问题。想法？

EDIT 2

现在有问题online here的演示。

来源

2009-07-15 Nathan Ridley

您是否有链接到此的实况样本？能够用萤火虫或类似软件模拟这种情况会有所帮助。 – 2009-07-15 10:00:26

好的，完成了。我已经上传到http://www.graphicsdistrict.com/css-issue/Accessory.htm – 2009-07-15 10:58:11

很好，海报将图像放在他自己的服务器上，然后在问题解决时将其删除。有帮助！ – Ryan 2013-02-25 06:02:12