Remove Ie10'S "Clear Field" X Button on Certain Inputs

Remove IE10's clear field X button on certain inputs?

Style the ::-ms-clear pseudo-element for the box:

.someinput::-ms-clear {
    display: none;
}

How can I disable the clear button that IE10 inserts into textboxes?

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

Remove “clear field” X button when Browser Mode : IE9 Document Mode:IE9 on certain inputs?

This only appears inside IE10+ when you emulate older modes; you can't disable it using the CSS property as it's only defined in IE10+ mode.

Dupe of

IE 10's -ms-clear pseudo-element, and IE5 quirks mode
Remove IE 10 Clear Button From Input Field
http://answers.microsoft.com/en-us/ie/forum/ie10-windows_7/how-can-input-clear-button-be-hidden-if-ie10-is/8f55602f-1a6b-452d-8cb3-e4cc6034b138
https://stackoverflow.com/a/15227216/126229
How can I disable the clear button that IE10 inserts into textboxes?

Disable IE 11 input clear 'X' button

_{(adding my comment from above as an answer since it turned out this was the cause of OP's issue)}

Your CSS is fine:

input::-ms-clear {    display: none;    height: 0;    width: 0;}

<input type="text" />

Remove IE 10 Clear Button From Input Field

You must have selected browser/document mode other then IE10/Standard in F12 tools

How do I remove “X” from search input field on IE

Use ::-ms-clear

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

How can I disable the clear button that IE10 inserts into textboxes?

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

How to remove clear button ( 'X' button ) from IE10 textboxes in compatibility mode?

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.

Here is the code pen:
http://codepen.io/rjuyal/pen/iGKnI

Excerpt from code

.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;
            }

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

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

Remove IE11's clear field X button on Windows 8

I had the same issue and the most of the css didn't help me to remove the clear button.
I solutioned this by simply setting width and height to 0 (plus display none)

.someInputdisplay::-ms-clear {display: none; width:0; height:0;}

I hope this might be helpful!

Remove Ie10'S "Clear Field" X Button on Certain Inputs