CSS（WordPress）不同浏览器的不同图像位置

Question

我有一个带有过渡到另一个图像的图像链接，并且在 Chrome、Edge、IE11 中都可以正常显示。但在 Firefox 中，一张图片错位了几个像素。您可以在http://444.a91.myftpupload.com/ 查看该页面。我在 Chrome 和 Firefox 上使用元素检查器，CSS 是相同的，但在我的一生中我无法解决这个问题。

HTML 图像位置错误：

<span id="zone-c"><a href="http://444.a91.myftpupload.com/projects/">
<img class="bottom" src="http://444.a91.myftpupload.com/wp-content/uploads/2016/12/see-the-work-center-hover.png" alt="" width="482" height="136"></a>
<a href="http://444.a91.myftpupload.com/projects/">
<img class="top" src="http://444.a91.myftpupload.com/wp-content/uploads/2016/12/see-the-work-center.png" alt="" width="482" height="136"></a>
</span>   

困扰我的 CSS：

.top, .bottom {
  left: -15px;
  top: 16px;
}

Answer 1

我同意@casraf。
看起来您正在使用 Visual Composer。

反正我觉得

.top, .bottom {
  left: -15px;
  margin-top: 16px;
}

会解决你的问题。