Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

How can I disable the new functionality in Internet Explorer 10 that shows a little 'x' in a textbox when it's focused and I have content in it?

IE10 Clear Button

like image 232
Josh Schultz Avatar asked Nov 20 '12 20:11

Josh Schultz


4 Answers

input[type=text]::-ms-clear {
    display: none;
}
like image 78
Josh Schultz Avatar answered Nov 04 '22 05:11

Josh Schultz


In IE 10+, text inputs (input[type=text]) show a (x) button on the right-side on the field once you start typing, it's used to clear/remove the entered text value.

In Chrome, search inputs (input[type=search]) show a similar button.

If you prefer to remove either of them for IE10+ and/or Chrome. You can add the style below to hide this button from the input.

See it in action... http://codepen.io/sutthoff/pen/jqqzJg

/* IE10+ */
::-ms-clear {
  display: none;
}

/* Chrome */
::-webkit-search-decoration,
::-webkit-search-cancel-button,
::-webkit-search-results-button,
::-webkit-search-results-decoration { 
  display: none; 
}
like image 44
Sutthoff Avatar answered Nov 04 '22 03:11

Sutthoff


This is how I did it

input[type=text]::-ms-clear
{
    display: none;
}
like image 2
Amit Mhaske Avatar answered Nov 04 '22 03:11

Amit Mhaske


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

This did the trick for me.

like image 2
stacksonstacksonstacks Avatar answered Nov 04 '22 03:11

stacksonstacksonstacks