21

Following the advice given in Remove IE10's "clear field" X button on certain inputs?

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

worked great with IE 11 on Windows 7 but not with IE 11 on Windows 8.1

I also tried 

.someinput::-ms-clear {
    height: 0;
    width: 0;
}

Any thoughts on removing the X on IE 11/Windows 8.1? Thanks

Community
  • 1
  • 1
Phil O
  • 1,174
  • 4
  • 21
  • 40

3 Answers3

34

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!

DD.
  • 925
  • 8
  • 8
  • 1
    Bootstrap 3 removes the clear button on input fields in Chrome, but not in IE, yet your code seems to work. I wonder why that isn't included in Boostrap. – redbmk May 04 '14 at 19:57
  • Probably it worked when bootstrap 3 was released but the new IE needs that hack. The good point is that there is a way to solve it =D – DD. May 06 '14 at 13:20
  • I confirm that "width: 0; height: 0;" is needed to make "display:none" work with IE11. Thank you :) – ilter Dec 04 '15 at 14:52
  • ie11 on windows 10 has this same problem for me. This css pseudo class resolved it. – ml242 Dec 15 '17 at 17:20
5

Check if "Display intranet sites in Compatibility View" was checked by default in Tools->Compatibility View Settings. Targetting ::-ms-clear and ::-ms-reveal doesn't work in compatibility mode.

davyu
  • 51
  • 1
  • 3
1

Can you use ::-ms-reveal for Win8 in conjunction with ::-ms-clear? http://msdn.microsoft.com/en-us/library/windows/apps/hh465773.aspx

.someinput::-ms-clear,
.someinput::-ms-reveal {
  display: none;
}
David Randall
  • 772
  • 3
  • 9