IE边框半径显示错误答案

【问题标题】：IE Border radius display errorIE边框半径显示错误
【发布时间】：2014-04-22 21:47:52
【问题描述】：

我对边框半径和 IE 9+ 有一个奇怪的问题。

浏览器在左侧显示圆角，就像在附加的图像中一样。如果您遇到此类问题，请告诉我您的解决方案。

我还附上了我用于成功消息的 CSS 示例：

width: 100%;
padding: 15px;
background-color: #beff97;
color: #68bd45;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;

编辑：我有<meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1">

这是我在那里做的事情的小提琴： http://jsfiddle.net/afXWu/

【问题讨论】：

【解决方案1】：

我刚刚用我的 IE9+ 测试了你的 jsfiddle 演示，没有任何与不正确显示border-radius 属性相关的问题。

IE9（仿真）

IE11

编辑

你没有关闭你的meta标签

<meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1"/>

或者你可以试试这个<meta http-equiv="X-UA-Compatible" content="IE=edge"/>。

【讨论】：

我可以补充一点，您正在使用 IE11 模拟 IE9，这是查看 IE9 如何实际呈现它的一种不准确的方式。要获得最准确的结果，请实际使用 IE9 或在 VM 上运行。
@Daniel Johnson，我同意，但目前我没有实际的 IE9，所以必须使用仿真。我也在IE11中测试过，一切都很好。我将添加另一个使用 IE11 的屏幕截图。
@user3529729 元标记末尾的斜线部分解决了这个问题。现在它随机显示错误所以我会检查你的答案是否有效。非常感谢！

【解决方案2】：

尝试禁用大纲属性：

outline:none;

【讨论】：