占位符颜色在IE中不起作用

Question

我已通过以下从here获取的代码将HTML页面中元素的占位符颜色设置为红色，如下所示：

.warningPlaceHolder::-webkit-input-placeholder {
    color: #CC3300;;
}
.warningPlaceHolder:-moz-placeholder {
    color: #CC3300;;
}
.warningPlaceHolder::-moz-placeholder {
    color: #CC3300;;
}
.warningPlaceHolder:-ms-input-placeholder {
    color: #CC3300;;
}

当我有一个简单的页面时，这在chrome，firefox和IE中运行良好，但是当我在包含许多其他元素和样式的主应用程序中使用它时，它在IE中不起作用。当我在IE中检查元素时，我在计算的样式中看到以下内容：

如上所示，它划掉了占位符颜色。我不确定IE是否真的忽略了这个或this is a bug！但在任何一种情况下，重要的是它似乎并没有真正生效！

下面是我的HTML元素，它已经分配了类warningPlaceHolder以及其他一些元素：

<input class="gwt-SuggestBox pick-list warningPlaceHolder" id="authorizationNumberSuggestBoxsuggestBox" type="text" maxlength="30" placeholder="This Field is Required">

问题：什么可能导致IE忽略我的占位符颜色？

PS。我在文档的css中有其他类，它们设置了占位符属性;但是，我只是希望分配给元素的最近的类应该优先。不应该吗？

我正在尝试使用IE 11版。

Answer 1

这不漂亮，但你试过吗

warningPlaceHolder:-ms-input-placeholder {
    color: red!important;
}

Answer 2

您错过了CSS中的n

(.)

试试这个。这对我来说可以。 这是Demo