css - 自动对齐 Bootstrap 内联表单中的复选框

Question

我有 following code :

<form class="form-inline">
        <div class="row">
            <div class="col-md-6">
                <fieldset>
                    <legend>Form one</legend>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="input1">Input1</label>
                            <div class="checkbox">
                                <input type="checkbox" id="input1">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="input2">Input2</label>
                            <div class="checkbox">
                                <input type="checkbox" id="input2">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="input3">Input3</label>
                            <div class="checkbox">
                                 <input type="checkbox" id="input3">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="input4">Input4</label>
                            <div class="checkbox">
                                 <input type="checkbox" id="input4">
                            </div>
                        </div>
                    </div>
                </fieldset>      
            </div>
            <div class="col-md-6">
                <fieldset>
                    <legend>Form 2</legend>
                 <div class="col-md-3">
                     <div class="form-group">
                        <label for="input5">Input5</label>
                        <div class="checkbox">
                            <input type="checkbox" id="input5">                                 
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label for="input6">Input6</label>
                        <div class="checkbox">
                            <input type="checkbox" id="input6">
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label for="input7">Input7</label>
                        <div class="checkbox">
                           <input type="checkbox" id="input7">
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label for="input8">Input8</label>
                        <div class="checkbox">
                            <input type="checkbox" id="input9">
                        </div>
                    </div>
                </div>
           </fieldset>
       </div>
    </div>
</form>

(我很抱歉识别不佳，但我也发布了一个指向 bootply 的链接)。我希望第一个表单的输入在每行出现两个，因此对于表单 1，它必须看起来像这样

Input1 input2 
input3 input4

和

Input5 Input6
Input7 Input8

对于第二列中的表格 2。我使用 col-md-6 类设置了两个列，并且在每个列中放置了字段。但即使设置了两个 3 的子列，我也无法得到我想要的结果。我究竟做错了什么？我正在使用 Bootstrap 3

Answer 1

我想你想要something like this

我将 col-md-3 更改为 col-md-6。

如果我没理解正确，请告诉我。