Asp.net mvc 4 MVC razor视图中的TwitterBootstrap 3文本输入隐藏了前几个字符

我在ASP.Net MVC razor应用程序中将twitter bootstrap 3与水平表单和表单组一起使用：

<form action="SomeAction" class="form-horizontal" method="post">
<div class="form-group">
    <div class="col-lg-3 control-label">
        @* label *@
    </div>
    <div class="col-lg-9">
        @* textbox *@
        @* validation *@
    </div>
</div>

通过文本输入，我得到的是：

前1-2个字符将隐藏，直到我在控件中单击，然后显示它们：

我正在使用IE10。google chrome中不会出现这种情况：

---

不确定如何解决此问题，因此非常感谢您的帮助

我找到了导致此问题的原因。我的_Layout.cshtml视图中有以下javascript：

$('input[type=text]').addClass('form-control');

$('input[type=text]').addClass('form-control');
$('input[type=text]').css('padding', '6px 0');

一旦我移除它并将类应用到它正确呈现的控件中：

@Html.TextBoxFor(model => model.Manufacturer, new { style = "width: 400px;", @maxlength="50", @class = "form-control" })

文本输入似乎是唯一存在此问题的输入。textarea和select的行为不同

我希望避免在每个视图的每个控件中都放置引导类。如果有人知道更好的方法，请告诉我

更新

事实证明，bootstrap.css（版本3.0.0，第1712行）中的填充样式（12px）导致了以下问题：

.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px; /* this line is causing the problem */
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

讨厌改变引导css。我正在我的_Layout.cshtml视图中临时覆盖它：

$('input[type=text]').addClass('form-control');

$('input[type=text]').addClass('form-control');
$('input[type=text]').css('padding', '6px 0');

---

我发现非常不幸的是，您必须为BS3中的每个表单控件显式指定类；与BS2相反，BS2隐式地为所有

input

元素设置样式。我在Bootstrap Githup页面上提出了这个问题：