Html 为什么'；在IE9中不工作边界半径，但在IE10或Chrome中？_Html_Css

Html 为什么'；在IE9中不工作边界半径，但在IE10或Chrome中？

html css

Html 为什么'；在IE9中不工作边界半径，但在IE10或Chrome中？,html,css,Html,Css,我只有IE9有问题，原因是。。。边界半径仅在一个div中不起作用，但在其他div中效果很好 IE9 IE10，铬合金，FF Html <article id="main-login"> <div class="radius-10 shadow"></div> <div id="area-login" class="radius-10 shadow"> <h2>Iniciar sesión</h2> <

我只有IE9有问题，原因是。。。边界半径仅在一个div中不起作用，但在其他div中效果很好

IE9

IE10，铬合金，FF

Html

<article id="main-login">
<div class="radius-10 shadow"></div>
<div id="area-login" class="radius-10 shadow">
    <h2>Iniciar sesión</h2>
    <p><input id="user-user" class="radius-10" type="text" placeholder="Usuario" required/></p>
    <p><input id="user-pass" class="radius-10" type="password" placeholder="Contraseña" required/></p>
    <p><input id="do-login" type="submit" value=""/></p>
    <small>Si aún no eres usuario</small>
    <medium>Registrate aquí</medium>
</div>
</article>

更新

谢谢你的时间，但我解决了我的问题

解决方案：在CSS中使用边界半径和过滤器时存在问题，然后只需注释此行：

 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5ecef',GradientType=0 ); /* IE6-8 */

而且效果很好

将.radius-10的内容更改为：

.radius-10 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

对于IE9，在下面的

标记内添加一行

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

最后，别忘了添加以下内容：

<!DOCTYPE html>

更新

将

#main login div

中的

显示更改为块
此问题通过声明过滤器：无来解决仅适用于IE9。如果您使用帮助获取特定类，您可以禁用该筛选器，如下所示：
.ie9 .class-with-gradient {
    filter: none;
}

或者为这些元素添加另一个类（如果有多个元素），并为它们禁用它。
像这样：
确保只有IE9可以得到这个类。否则-IE8和IE7也将无法获取筛选器。请参阅此lnik我不需要该文件，因为第一个文件适用于IE6、7和8，我的问题是，因为左侧的div正确工作，但右侧的不行。请将答案发布为。。。请回答一下：然后自动接受它，以帮助与您相同情况下的其他用户。。。非常感谢。我把你的代码放在了我的项目中，但还没有开始工作。。它很少在左边的div中工作，但在右边没有。我不能使用display:block in#main login div，因为在我的问题中，我需要像图片一样内联这两个div，但是在display block中，第一个div下面的div只发生了变化。哦，这就是IE中的问题。Bummer。
.ie9 .class-with-gradient {
    filter: none;
}

.gradient {
    filter: none;
}