Question

http://www.bootply.com/9WB3SixQNr

[{
    "name": "node1",
    "id": 1,
    "is_open": true,
    "children": [{
        "name": "child1",
        "id": 2
    }, {
        "name": "child3",
        "id": 3,
        "is_open": true,
        "children": [{
            "name": "child2",
            "id": 4
        }]
    }, {
        "name": "child2",
        "id": 5
    }]
}, {
    "name": "node2",
    "id": 6,
    "is_open": true,
    "children": [{
        "name": "child3",
        "id": 7
    }]
}]

＆＃34; Text＆＃34;未与复选框对齐。该复选框略低于文本。如何在同一条线上制作它们？＆＃34;文字＆＃34;并不是一个标签，如果我在输入标签后面添加一个标签，那么对齐就好了（我看到其他问题是对齐标签和复选框，这是不同的）。我想要＆＃34; Text＆＃34;显示在左侧correclty与复选框一致。

Answer 1

你没有正确处理bootstrap中的列。

此代码对我有用：

<div class="container">
<form class="form-horizontal">

  <div class="form-group">
    <div class="col-sm-2 ">
      <label class="control-label">Text</label>
     </div>
     <div class="col-sm-10">
       <label class="checkbox checkbox-inline">
         <input id="123" name="Checkbox" value="a" type="checkbox">
       </label>
     </div>
  </div>

</form>
</div>

这就是让div中的两个元素并排的CSS：

.checkbox{
  float:left;
}
.control-label{
  float:right;
}

以下是它的链接：DEMO

如何使用bootstrap3对齐文本和复选框

1 个答案: