缩放时保持按钮文本外观

Question

当用户放大或缩小时，如何保持按钮的外观？文本和按钮边缘之间的间距需要保持一致。

在这里描绘的小提琴上工作：http://jsfiddle.net/DevinRhode2/B4Usb/5/

如果您将浏览器缩放设置为100％并从小提琴中移除zoom: 1.1;，您将看到包含完全包含且居中的文本的按钮 - 这个目标就是目标。

也许通过必要的修改，为本机mac风格的按钮重新创建css更容易。

修复此问题，或者重新创建相同的OS X样式，并不容易，所以我开始了赏金。

Answer 1

我已经检查过chrome，firefox和IE，所有内容都缩放得恰到好处，并且没有看到按钮边界之外的文字。 http://i.imgur.com/q3mZ7.png

Answer 2

在Chrome上使用OSX确实存在问题，这是因为OSX为按钮设置了非常好的默认样式规则。

您可以通过将自己的背景样式添加到按钮来修复它：

#fixed {
    background: #eee;
    border: 0;
}

我也删除了边框，因为样式按钮的默认边框是uuugly。

http://jsfiddle.net/B4Usb/7/