在Safari中，图片破坏了圆角边框

Question

我在Safari中使用圆角和图片时遇到了一些问题，但在Chrome中却很好用。请看一下这个jsfiddle，解释了我的问题：http://jsfiddle.net/2cTPw/1/。为什么会这样？我错过了什么吗？我尝试搜索答案，但我能找到的只是有类似问题的人，没有解决我的问题。 :/

- Calle Erlandsson

Answer 1

这是Safari浏览器已知的问题。解决方法是将图片设置为div的背景：

<div id="box" style="background-image:url(http://www.omnidev.se/images/uploads/omnidev_media.png)" />
</div>

请看这个分支：http://jsfiddle.net/qHG7z/

- Aleks G

---

这是一个不错的解决方案，但由于我使用JavaScript在加载后调整图像的大小和位置，所以采用这种方法会变得非常复杂。但还是谢谢！ - Calle Erlandsson

Answer 2

这是因为 Safari 浏览器没有考虑到边框的影响。您可以尝试像这样的解决方法：

http://jsfiddle.net/2cTPw/4/

- Lee

---

虽然标记方式不太好看，但它的效果非常好！ :) 我认为这可能是解决这个问题的唯一方法！谢谢！ - Calle Erlandsson