Question

寻找一个带有（居中）标签的复选框示例：

 IamALabel  
    [ ]

如果重要的话，我正在使用（ASP.NET）MVC 5。我尝试了几个简单的事情，但它不会把它集中在一起：

 <div>
      <label for="checkbox1"><span></span>IamALabel</label>
      <br/>
     <input id="checkbox1" type="checkbox" name="checkbox" value="IamALabel" checked="checked">
    </div>

还有：

 <div>
      <label for="checkbox1" style="display: inline-block; text-align:center"><span></span>IamALabel</label>
      <br/>
     <input id="checkbox1" type="checkbox" name="checkbox" value="IamALabel" checked="checked">
    </div>

Answer 1

您可以使用display: table技术：

div {
    display: table;
    float: left;
    margin-right: 15px;
}
label {
    display: table-row;
}
#chk {
    display: table-row;
    width: 100%;
}

<div>
    <label for="male">IamALabel</label>
    <input type="checkbox" id="chk" />         
</div>
<div>
    <label for="male">IamALabel</label>
    <input type="checkbox" id="chk" />         
</div>
<div>
    <label for="male">IamALabel</label>
    <input type="checkbox" id="chk" />         
</div>

修改

要在彼此附近添加多个标签/复选框，请在float: left元素中添加div。

复选框顶部的居中标签

1 个答案: