Bootstrap复选框水平对齐错误

Question

我使用了Bootstrap文档中的basiexample:http://getbootstrap.com/css/#forms-example

问题是复选框未与其余元素对齐.我试图将display属性设置为inline,但这没有帮助.

知道为什么吗？ https://jsfiddle.net/6ua8xmce/

Answer 1

更改class="checkbox"与class="form-group"

<div class="container">
    <h1>Hello test</h1>
    <form>
        <div class="form-group">
            <label for="exampleInputEmail1">Email address</label>
            <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
        </div>
        <div class="form-group">
            <label for="exampleInputPassword1">Password</label>
            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
        </div>
        <div class="form-group">
            <label for="exampleInputFile">File input</label>
            <input type="file" id="exampleInputFile">
            <p class="help-block">Example block-level help text here.</p>
        </div>
        <div class="form-group">
            <label>
                <input type="checkbox"> Check me out
            </label>
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
    </form>
</div>

的jsfiddle