无法使用Bootstrap 3在MVC Razor视图中应用控件的allignment

Vis*_*til 5 css asp.net-mvc html5 razor twitter-bootstrap-3

问题陈述:

在我的一个编辑视图中,我希望将文本框设置为禁用,因此为此我使用DisplayFor而不是TextboxFor.但是,当我使用Displayfor时,对齐不正确.您可以看到附加的图像供您参考.我正在使用Bootstrap CSS 3.0

任何帮助,将不胜感激.我应该使用什么内联CSS来正确对齐?

Image1:在此图像中,您可以看到Acquire Status ID标签和Textboxfor正确对齐. 在此输入图像描述

Image2:当我使用DisplayFor而不是Textboxfor时,Acquire Status ID标签和Displayfor未正确对齐.

在此输入图像描述

视图:

<div class="form-horizontal">
        <hr />
        @Html.ValidationSummary(true)

        <div class="form-group">
            @Html.LabelFor(model => model.AcquirestatusID, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DisplayFor(model => model.AcquirestatusID,new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.AcquirestatusID)
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.TextBoxFor(model => model.Name, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.Name)
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-default" />
            </div>
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

Vis*_*til 4

我使用 Textboxfor 的只读属性解决了我的问题。

 @Html.TextBoxFor(model => model.AccessoriesID,new { @class = "form-control",@readonly="readonly" })
Run Code Online (Sandbox Code Playgroud)

应用上面的代码行后,我的编辑视图看起来:

在此输入图像描述