Summary:

The behaviour of the Clear ([X]) button in Internet Explorer may be a little unpredictable. This is controlled by a poorly-documented Internet Explorer pseudo-element, and so it may appear or disappear between CRM or Internet Explorer versions. If it's necessary that this is displayed, it can usually be made to appear using a CSS hack.


 
More information: 

A useful feature of Internet Explorer is the -ms-clear pseudo-element. This is a custom element applied to inputs when a webpage is being viewed using Internet Explorer. When it's enabled, users will see an X on the right-hand side of input fields, allowing them to clear the contents.

In the screenshot below, the user has focus in the Case_Descripton field on CaseDetailBox. Since text has been entered into this field, the greay Clear button appears.

 

CaseDetailBox showing Clear element

 

If they click the Clear button, the text in Case_Description will be deleted. This is particularly useful for devices with a touch interface.

This element is specific to Internet Explorer, though other browsers may show similar behaviour - Chrome will display a similar X, but only on Search fields.

You may find that this Clear button appears and disappears on small input fields in Sage CRM, depending on your CRM and Internet Explorer version. An example of this is on the fields associated with date pickers.

Sage CRM does not contain any custom code that controls the behaviour of this element - it is entirely driven by the browser. Internet Explorer can decide whether or not the Clear button should be displayed, based on a combination of the element width, the font size, and whether there is any padding involved. This behaviour is undocumented by Microsoft, and has changed in the browser between versions, and also as the result of regular updates.

In general, we try to keep Sage CRM browser-agnostic. If the behaviour for this element were to be documented explicitly, it would be useful to try to accomodate it in CRM (it's great for tablets!). However, this is not the case at present, and making frequent changes to the CRM UI to accommodate this feature could cause further issues.

If you would really like to have this element appear, then you can make it happen by making a few small changes to Sage CRM's CSS. The example below is for date picker time fields when using the Color theme. Just add the CSS below to color1.css in the \CRM\WWWRoot\Themes\ directory:

 

.EDIT.hasDatepicker {
    font-family: Tahoma, Arial; font-size: 11px;
}
.EDIT[name$="_TIME"] {
    font-family: Arial; font-size: 11px;
}

 

This won't necessarily work forever (either Sage CRM or the browser may be updated, resulting in this not ceasing to work), but is correct as of Sage CRM 7.3 SP3 and Internet Explorer 11.0.28.


 
Further reading:

The -ms-clear pseudo-element is documented here:

https://msdn.microsoft.com/en-us/library/windows/apps/hh465740.aspx