html - 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;
}

会解决你的问题。