CSS3边框半径和IE9

Question

我有我用ColorZilla生成的CSS3渐变。我很确定是什么导致了问题是数据的URI。这是我的小提琴：http://jsfiddle.net/cY7Lp/。

在WebKit & Firefox中，角落是圆形的，但是在IE9中，角落是圆角的，梯度在它们外面流血，我不希望梯度在角落外流血。有人知道它为什么会发生？

---编辑---

我忘了说，这并不与内联元素，只有块元素发生。

Answer 1

它与您的SVG图像或其数据URI无关，但它与您的filter有关。您使用的filter属性生成的效果不会被border-radius剪辑，并且经常与某些其他内容（如背景图片）重叠。

不管这是真正的错误还是意想不到的副作用，我都不知道，但是这是IE9的原因，因为它没有实现CSS3渐变 - 只有IE10才有。

既然您使用的是SVG图像，您可以轻松地回退到该位置，而不是使用filter。

Answer 2

边框半径问题似乎在这里讨论：

Support for "border-radius" in IE

...所以，有可能是您的浏览器在传统模式下渲染。