windows - 1 pixel vertical discrepancy between text on OSX and Windows

Question

I have a pretty simple button that is marked up like this:

<a href="#" class="common_cta buttons send_inquiry">
    <span>Back to homepage</span>
</a>

The computed style of the <a> element looks like this: http://pastebin.com/u9q6BDHx

The computed style of the <span> looks like this: http://pastebin.com/P9mR7yHF

Here's what it looks like in comparison, Windows vs. OSX:

As you can see, there's a one pixel discrepancy between Windows and everything else. The designers are requiring that this be a pixel-perfect implementation and I have no idea how to fix the problem specifically for OSX.

How can I fix this?

Answer 1

o您会发现每个浏览器在处理 CSS 的方式上至少会略有不同。例如，我公司的网站使用了一些疯狂的 SEO“技巧”，以使 Goggle 与用户看到信息的位置相比，在页面中获得更高的部分。因此，我编写的一些 CSS 需要针对特定​​浏览器进行调整。

我相信您正在寻找的是类似于以下内容的内容，允许使用每个浏览器的单独样式：

.win.ie .buttons {padding:3px 5px;}
.mac.gecko .buttons {padding:4px 5px;}
.chrome .buttons {padding:4px 6px;}
.win.gecko .buttons{padding:4x 6px;}