0

我有一个与 Windows 7 上 IE11 中特定于 MS 的伪元素的 CSS 问题有关的特殊问题。

为了消除 IE11 表单中大多数 INPUT 元素右侧边缘的“清除/X”按钮,我添加了一个简单的 CSS 样式规则,如下所示:

INPUT::-ms-clear{
    display: none;
}

这似乎工作得很好 - 直到有人遇到有问题的网站并看到这种样式应该删除的按钮。所以我开始使用 IE11 开发工具调试问题,当我加载有问题的页面时(在我的实例中没有“x”,正如预期的那样),我当然希望在“样式”窗格中看到上面的样式规则 - 但是没有这样的运气。

开玩笑,我尝试在开发工具中将其添加为内联样式,但 IE11 表明它不适用 - 被划掉 - 但我找不到任何其他风格胜过它。禁用页面的所有样式仍然会禁用此伪元素样式。所以现在,我不确定如果没有应用我的样式规则,为什么“清除”按钮不会出现。

我难住了。我有 IE11 的三个实例,相同的版本,相同的安装源,其中两个以不同的方式从同一站点呈现同一页面,并且显然尊重(或不尊重??)这种风格规则不一致(或不完全)。我只是不明白为什么 - 或者为什么规则没有出现在开发工具中。可能只是浏览器错误??

4

3 回答 3

5

我们发现了这个问题的原因。

当在两个不同的站点(本地主机和测试站点)上打开两个浏览器来访问同一页面时,一个带有“clear”小部件,一个没有,我们还注意到呈现的 HTML 是不同的,从 DOCTYPE 声明开始。那打开了一个灯泡 - 仿真模式。仿真模式告诉我们,测试框上的 IE 实例正在以兼容模式呈现页面,因为它是“我们的 Intranet 上”的站点,并且选中了“在兼容性视图中呈现 Intranet 上的所有站点”选项。取消选中此框,“清晰”的缺口就体现了我们的风格并消失了。

问题解决了。

感谢大家的意见。

于 2014-08-27T19:04:58.000 回答
3

::-ms-clear唉,即使将 IE11 F12 工具应用于元素,它们也不会显示在样式窗格中。这是我们想要解决的问题。

于 2014-08-19T15:26:04.947 回答
1

我发现最好将宽度设置height为 0px。否则,IE10 会忽略该padding字段上的定义 -- padding-right-- 这是为了防止文本键入我覆盖在输入字段上的“X”图标。

我猜 IE10/11 在内部将padding-right输入的 应用于::--ms-clear伪元素,隐藏伪元素不会将padding-right值恢复到输入。

试试这个代码

input[type=text]::-ms-clear{
    width:0;
    height:0;
}

或者

input[type=text]::-ms-clear{
    display:none;
}

并阅读有关::-ms-clear伪元素的更多信息

于 2014-08-19T14:04:03.333 回答