网站显示问题取决于计算机

Question

在五台不同的计算机上使用相同的分辨率，相同的浏览器（firefox 14.01），其中一个是mac，另外三个在ubuntu上运行，最后一个在Windows 7上运行。

所有测试都是在没有任何插件的干净浏览器上执行的......

我们也试图交换屏幕，没有什么不同，浏览器有问题，它仍然有它。

另外，使用firebug，我比较了每个元素，并且它们都是相同的，除了我的link（）在2台计算机上还有2个像素。

我试过每一个浏览器（Opera，Chrome，Firefox，Safari，IE 7-8-9），当我没有在Firefox上使用它时我没有问题，但是当我这样做时，我确实有每个浏览器上的问题......

我显示了许多html元素的问题。

所以这是我的问题：可能导致这种情况的原因是什么？

以下是我的HTML代码：

<td style="text-align:center">
    <a style="margin-right: 10px;" href="#">
        <img alt="View" src="/statics/images/Form/view.png">
     </a>

    <a style="margin-right: 10px;">
        <img alt="Edit" src="/statics/images/Form/edit.png">
    </a>

    <a style="margin-right: 10px;" href="#" >
        <img alt="Delete" src="/statics/images/Form/delete.png">
    </a>
</td>

以下是我的

的CSS代码

a {
    margin-right: 10px;
    cursor: pointer;
    text-decoration: underline;
}

这是图片：

不工作时：

工作时：

感谢任何建议！

谢谢你们......

我们发现添加1 px的填充顶部（我们不认为这是我们的问题，因为它来自宽度），具体取决于它所在的计算机...

Answer 1

不妨尝试一下，然后尝试减小宽度：

<td style="text-align:center; width: 200px">

由于您使用链接包装图像，因此您可能会给它一个边框（这适用于非常旧的浏览器，不应该在css重置时发生，但是......）

a img { border: 0 }

Answer 2

尝试将a设置为：

a {
    margin-right: 10px;
    text-decoration: none;
}

td a {
    display: inline-block;
    width: 27px;
}

我将27px作为宽度进行简单测试，根据图像大小进行应用。

您还可以尝试将固定宽度应用于td，足以嵌套您的三张图片。

Answer 3

a {

margin-right: 10px; 
text-decoration: none;

}

a：悬停{

margin-right: 10px; 
text-decoration: underline;

}

1. 删除内联样式标记
2. 将href添加到所有标签更好地使用javascript：void（）或javascript：;而不是＃