[Windows Tip] Disable Clear Button (X) from Text Boxes in Internet Explorer

You might have noticed that Internet Explorer 10 and later versions show a clear field button 'X' in text boxes which can be used to clear the content of the text box. If you are browsing a website containing text input controls such as name, email, etc and you click inside a text box and start typing, you get the clear button on the right-side of the text box to remove everything written in the text box as shown in following screenshot:

Clear_Button_Text_Box_Internet_Explorer.png

Although its a useful feature but some people might want to disable this feature. Recently an AskVG reader "Nedo Papanti" asked us a way to hide or remove this clear button 'X' from text fields in IE10 and later versions.

Windows doesn't provide any built-in option to disable clear button from text boxes in Internet Explorer but we can take help of a small CSS code to remove this button. Actually this clear button inside text boxes is shown by a pseudo element called "::-ms-clear" and we can hide the clear button using its "display" property.

If you also want to disable clear button from text fields in Internet Explorer, following steps will help you:

1. First of all, you'll need to create a CSS file containing following code:

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

You can create the CSS file using Notepad or any other text editing program.

For your convenience, we are providing a ready-made CSS file containing the required code. Download following ZIP file, extract it using 7-Zip or any other file archive utility and you'll get the CSS file:

Download CSS File to Remove Clear Button from Text Box in Internet Explorer

2. Now open Internet Explorer and click on Tools button (gear icon) present on the toolbar. Alternatively you can press ALT+X keys together to access Tools menu.

Open_Internet_Explorer_Options.png

3. Now select Internet Options item from Tools menu. It'll open Internet Options window.

4. Now click on Accessibility button present on the first tab.

Internet_Explorer_Accessibility_Options.png

5. It'll open Accessibility dialog box. Enable "Format documents using my style sheet" checkbox and click on Browse button.

Format_Documents_Using_My_Style_Sheet_Internet_Explorer.png

6. It'll open browse window to select .CSS file. Select the downloaded CSS file in the browse window.

Select_User_Style_Sheet_Internet_Explorer.png

And then click on OK button in the accessibility dialog box.

7. Again click on OK button in Internet Options window and now you'll no longer see the clear button 'X' in text boxes.

PS: In future, if you want to restore clear button 'X' in text boxes, uncheck the "Format documents using my style sheet" checkbox in Accessibility dialog box.

Also Check:





Share this article: Facebook | Twitter | Google+ | Reddit | Tell a friend

Posted in: Internet Explorer, Windows 10, Windows 7, Windows 8 / 8.1


Other similar articles that may interest you


Leave a Comment

(required)