IE 11 input not displaying typed text

Question

A work's client has reported an issue in our application when working with IE11.

On an specific form, sometimes, when opening it, if you type, the typed text won't show. If I open developer tools, it suddenly shows.

This is the rendered html belonging to that form:

<div class="col-sm-6 ">
<div class="form-group" data-ng-show="myform.txtPropietario.visible">
<label class="col-md-4 control-label my-show-hide-animation">Propietario:</label>
<div class="col-md-8"> 
<div class=" ">
<input name="txtPropietario" class="form-control text-left ng-pristine ng-valid" input-alpha-numeric="ES" onblur="this.value=this.value.toUpperCase();" data-ng-model="myform.values.txtPropietario" data-ng-disabled="myform.txtPropietario.disabled" type="text" step="0.01" maxlength="50" placeholder="  "></div> 
<ul class="errores my-show-hide-animation ng-hide" data-ng-show="myform.seccionPanelPagoServiciosname.txtPropietario.$invalid &amp;&amp; myform.procesado"><li data-ng-show="myform.seccionPanelPagoServiciosname.txtPropietario.$error.required" class="ng-hide"><span>Campo obligatorio</span></li><li data-ng-show="myform.seccionPanelPagoServiciosname.txtPropietario.$error.pattern" class="ng-hide"><span>El formato del dato ingresado no es válido.</span></li>
</ul>
</div>
</div>
</div>

The app work's over AngularJs and html is built over Bootstrap 3. Any idea why is this happening?

Answer 1

It's hard to tell without seeing the CSS, however i encountered this issue a while back and fixed it by setting the height of the input box.

My theory is that IE didn't think there was enough height to show the text in the font size I had specified.

For example

<input type="text" id="example" style="height: 40px" /> 

I hope this helps.