在剃刀视图中使标签和复选框更加靠近

Question

我的label中有checkbox和view，我希望彼此相邻。但是，正如你在这张照片中看到的那样，我无法让它们更近。

这是我的观看代码：

@using (Html.BeginForm("AddTechNote", "Ticket", FormMethod.Post)) { @Html.AntiForgeryToken()
<div class="form-group">
    @Html.HiddenFor(model => model.TicketId)
    <div class="col-md-12 col-xs-12">
        <div class="col-md-3">
            @Html.Label("New Note", new { @class = "control-label" })
        </div>
        <div class="col-md-1" style="text-align: right">
            @Html.Label("Public", new { @class = "control-label" })
        </div>
        <div class="col-md-1">
            @Html.CheckBox("PublicNote", new { @class = "chk=style", @checked = "checked" })
        </div>
    </div>
    <div class="col-md-12 col-xs-12">
        @Html.TextArea("Note", new { cols = 600, @rows = 5 })
    </div>
    <div class="form-group">
        <div class="col-md-2">
            <input type="submit" value="Add" class="btn btn-default" />
        </div>
        @*<div class="col-md-1 col-lg-offset-1">
        </div>
        *@
    </div>
</div>
}

耶稣，

这就是我提供的代码。到目前为止，感谢您的帮助。

Answer 1

您可以执行以下操作： 仅对REPAIR TABLE tbl_name EXTENDED和label使用一个div，如：

checkbox

标签需要包装输入。

Answer 2

您需要更改Razor视图，如下所示：

<div class="@Model.ControlDimension">
    <div class="checkbox @Model.CheckBoxDivClasses">
        <label for="@Model.ControlName">@Html.Raw(Model.Label)@Model.ControlFor</label>        
        @Model.ValidationMessageFor
    </div>    
</div>

控件需要位于标签元素内。

在你的情况下，我认为......：

<div class="col-md-2">
    <div class="checkbox">
        <label for="PublicNote">
            Public
            @Html.CheckBox("PublicNote", new { @class = "chk=style", @checked = "checked" })
        </label>
    </div>
</div>