我可以使用 Bootstrap 类使 DropDownListFor 宽度与 TextBoxFor 宽度相同吗？

【问题标题】：Can I make DropDownListFor width the same like TextBoxFor width with Bootstrap class?我可以使用 Bootstrap 类使 DropDownListFor 宽度与 TextBoxFor 宽度相同吗？
【发布时间】：2018-08-16 14:54:05
【问题描述】：

我有 NewCustomer 视图：

        <table class="table">
            <tr>
                <td class="text-right">
                    @Html.LabelFor(model => model.Customer.GenderId)
                </td>
                <td>
                    @Html.DropDownListFor(model => model.Customer.GenderId,new SelectList(Model.Genders,"Id", "GenderType"),"-=Select Title=-")
                </td>
            </tr>
            <tr>
                <td class="text-right">
                    @Html.LabelFor(model => model.Customer.Name)
                </td>
                <td>
                    @Html.TextBoxFor(model => model.Customer.Name)
                </td>
            </tr>

        </table>

我可以将宽度下拉列表和文本框与 boostrap 类对齐吗？

DropDownList is too narrow

【问题讨论】：

标签： model-view-controller view width dropdownlistfor html.textboxfor

【解决方案1】：

我改了代码：

    <div class="form-horizontal">

        <div class="form-group">
            @Html.LabelFor(model => model.Customer.GenderId, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">   

                @Html.DropDownListFor(model => model.Customer.GenderId, new SelectList(Model.Genders, "Id", "GenderType"), "Select Title", new { @class = "form-control " })
                @Html.ValidationMessageFor(model => model.Customer.GenderId, "", new { @class = "text-danger" })
            </div>
        </div>

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

【讨论】：