如何在兼容模式下从IE10文本框中删除清除按钮（'X'按钮）？ [英] How to remove clear button ( 'X' button ) from IE10 textboxes in compatibility mode?

问题描述

目前我正在使用一个网站，使用元标记以IE9模式呈现网页[BrowserMode：IE10，DocMode：IE9 Standards]

Currently I am working on a website which is using meta tag to render the page in IE9 mode [ BrowserMode: IE10, DocMode: IE9 Standards ]

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

在IE10中大量的CSS中断页面，因此使用 IE = Edge 不是一个可行的解决方案，因为现在（可能在未来这将使用一旦所有的css是固定的，但我不会看到这不久的将来）。

In IE10 lots of CSS breaks in the page, so using IE=Edge is not a viable solution as of now ( may be in future this will be used once all the css is fixed, but I don't see this near future ).

现在，点是所有的文本框都有清除按钮。在一个文本框中，我们不需要交叉（因为我们已经有一个自定义的（x）按钮远在文本框）。

Now, the point is all of the textbox have clear button in it. In just one of the textbox we don't need that cross ( as we already have a custom (x) button far right from text-box ).

code> :: - ms-clear 但是didn; t工作，因为我们在BrowserMode：IE10和DocMode：Standards。现在可以做什么去除那个'X'。

I tried ::-ms-clear but that didn;t worked as we are on BrowserMode: IE10 and DocMode:Standards. What can be done now to remove that 'X' .

推荐答案

我终于设法解决这个问题。显然，如果你将 height 和 line-height 设置为0和 padding-top 和 padding-bottom 到文本框高度的一半，那么这个真棒'X'将不再显示。至少这对我工作。

I finally managed to fix this issue. Apparently if you set height and line-height to 0 and padding-top and padding-bottom to half of the height of your textbox, then this awesome 'X' will not be displayed anymore. Atleast this worked for me.

以下是代码笔：
http：// codepen .io / rjuyal / pen / iGKnI

摘录自代码

.gen{
                margin: 10px;
                margin-top: 40px;

                box-shadow: inset 1px 2p 0 rgba(200, 100,10, 0.2 );
                font-size: 16px;

                width: 400px;
                line-height: 18px;
                height:  41px;
                fint-family: 'Lucida Grande' , 'Arial';
                vertical-align: middle;
            }

            .ie10f{
                height: 0px !important;
                line-height: 0px !important;
                padding-top: 22px !important;
                padding-bottom: 22px !important;
            }

您将看到两个文本框，一个 X 另一个没有它。
最好的部分是，这隐藏了IE10中的 X （无兼容模式）。

You will see two text-boxes one with X another without it. Best part is, this hides X in IE10 ( no compatibility mode ) also.

您必须从开发人员工具手动将DocMode更改为IE9。

P.S. You will have to manually change the DocMode to IE9 from developer tools.

这篇关于如何在兼容模式下从IE10文本框中删除清除按钮（'X'按钮）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！