IE11输入类型文本内容转到新行

Question

我在项目中使用简单的文本输入（type = text）和angularJS。

HTML标记

<input type="text"
       ng-model="startDate"
       ng-class="{'fieldBorder' : dateRangeSelIndex == 0}"
       ng-focus="setBorderOnFocuse($event,0)" />

我正在使用以下JavaScript代码在获得焦点时设置输入的边框。

$scope.setBorderOnFocuse = function ($event, selIndex) {
                                $scope.dateRangeSelIndex = 0;
                            }

这种行为在Firefox和Chrome浏览器中运行良好，但是当我在IE11中测试时，输入框的内容在点击课程位置后进入第二行。

检查以下行为屏幕截图。

我已经检查了应用它的CSS，输入框有足够的长度来处理一行中的内容。

提前致谢！

修改 CSS应用于输入

    padding: 0;
    width: 100px;
    height: 27px;
    font-size: 12px;
    white-space: nowrap;
    line-height: normal;

JS Fiddler同样http://jsfiddle.net/U3pVM/21997/

我无法在jsfiddler中重现相同的行为，但我发现一个有趣的事情，这可能是由于IE11在焦点上的输入文本中添加了交叉。