如何更改剃刀複選框對齊

Visual Studio 2013中的標準ASP.NET MVC模板生成一個頁面Register.cshtml，它定義了將新用戶註冊到系統中的UI。我將其擴展爲添加「我接受條款」複選框。這裏是代碼片段：如何更改剃刀複選框對齊

<div class="form-group"> 
    @Html.LabelFor(m => m.ConfirmPassword, new { @class = "col-md-2 control-label" }) 
    <div class="col-md-10"> 
     @Html.PasswordFor(m => m.ConfirmPassword, new { @class = "form-control" }) 
    </div> 
</div> 
<div class="form-group"> 
    <div class="col-md-offset-2 col-md-10"> 
      @Html.CheckBoxFor(m => m.AcceptTerms, new { @class = "form-control" }) 
      @Html.Label("I accept", new { @class = "control-label" }) 
    </div> 
</div>

這個想法是chexkbox顯示在密碼編輯框下面。文字必須顯示在複選框的右側。

這裏是輸出的外觀局部圖像：

Partial image

正如你可以看到，該複選框越來越居中對齊和「我接受」流動到下一行。

如何將複選框和標籤保留在一起，並確保複選框與上方的編輯框左對齊？問候。

來源

2015-03-03 Peter

這是一個CSS問題 – Veena 2015-03-03 06:29:21

操作方法......

<label> 
I accept 

@Html.CheckBoxFor(m => m.AcceptTerms) 
</label>

來源

2015-03-03 05:31:14

看來， '標籤' 和/或input type="checkbox"有顯示類型block。

要快速檢查嘗試添加style="display: inline-block"到Label和CheckBoxFor。如果我是對的，那麼你可以糾正你的.css文件。

來源

2015-03-03 06:42:30

嘗試......希望這將有助於

<div class="checkbox"> 
    @Html.CheckBoxFor(model => model.IsMobileView, new { htmlAttributes = new { @class = "form-control pull-left" } }) 
</div>

來源

2016-02-10 08:16:07

如何更改剃刀複選框對齊

回答

相關問題