在Safari for Mac中渲染border-radius

Question

我在渲染具有border-radius的元素角时遇到问题。

我使用以下代码，它适用于Windows上的所有主流浏览器，包括Safari。

border: 1px solid #555;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;

现在我的客户端有Mac和Safari浏览器，以下是丑陋边框渲染的屏幕截图，这就是问题所在。

有谁知道这种渲染的原因是什么？ （The original page）

Answer 1

你应该尝试Mac Safari

-webkit-background-clip: padding-box;