CSS 不适用于 IE 9答案

【问题标题】：CSS not working with IE 9CSS 不适用于 IE 9
【发布时间】：2014-08-28 16:26:47
【问题描述】：

我有以下 HTML 和 CSS。 CSS 在 Firefox 中运行良好，但在 IE 9 中没有应用颜色。我已将 doctype 指定为 xhtml 文件。我如何使它与 IE9 一起工作？

HTML：

<div id="j_idt19:j_idt20" class="ui-tabmenu ui-widget ui-widget-content ui-corner-all">
    <ul class="ui-tabmenu-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist">
        <li class="ui-tabmenuitem ui-state-default ui-state-active ui-corner-top" aria-expanded="true" role="tab">
            <a id="j_idt19:homeTab" class="ui-menuitem-link ui-corner-all tabMenuDefaultCls" href="/XXX.xhtml?i=0" tabindex="-1">
                <span class="ui-menuitem-text"> … </span>
            </a>
        </li>
        <li class="ui-tabmenuitem ui-state-default ui-corner-top" aria-expanded="false" role="tab"> … </li>
        <li class="ui-tabmenuitem ui-state-default ui-corner-top" aria-expanded="false" role="tab"> … </li>
    </ul>

</div>

CSS：

.ui-state-active li {
    background-color: #F85A5A !important;
}


li[aria-expanded="false"] {
    background-color: #9975FC !important;
}

li[aria-expanded="true"] {
    background-color: #F85A5A !important;
}

.tabMenuDefaultCls {
    /* background-color: #9975FC; */
}

答案：

通过给予 css 类更多的优先级解决了这个问题，

li[aria-expanded="false"] a {
        background-color: #9975FC !important;
}

li[aria-expanded="true"] a {
        background-color: #F85A5A !important;
}

在 css 类中添加标签以获得优先权。

【问题讨论】：

标签： html css internet-explorer

【解决方案1】：

您是否在<head> 标签之后添加了这个MetaTag：

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

希望它能解决你的问题。

【讨论】：

【解决方案2】：

也许 suraj 在这里给出的答案与您相关： Why IE doesn't support my CSS positioning

如果它让你振作起来，在 IE11 上它可以正常工作..

http://jsfiddle.net/cg6jLnax/

【讨论】：

我使用 JSF 并且 JSF 框架的 css 类覆盖了我的 css 属性选择器类。
什么是“e”？尽量在你的回答中说清楚。@Hatul
@Jayaprasad 我无法在答案中没有代码的情况下发布 jsfiddle 链接。