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

...所以，有可能是您的瀏覽器在傳統模式下渲染。