一行中的元素排列[关闭]

有一个页面，您需要在该页面上将多个元素排列成一行。我做到了，但出于某种原因，在两种不同的情况下，我采取了不同的做法，我不明白为什么。

选项1：

    <div class="row">
                <div class="col-sm-4">
                    <div class="form-group">
                        @Html.Label("С", new { @style = "margin-right: 5px" })
                        <input type="date" />
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        @Html.Label("По", new { @style = "margin-right: 5px" })
                        <input type="date" />
                    </div>
                </div>
            </div>

4 个元素排成一排。但是有一个例子不适合相同的方法。选项 2：

    <div class="row">
                <div class="col-sm-10">
                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group" style="margin-right: 10px">
                                @Html.RadioButton("Proceeds", "Seller", true)
                                @Html.Label("По продавцу")
                            </div>
                        </div>
                        <div class="col-sm-8">
                            <div class="form-group">
                                @Html.DropDownList("sellerList", Enumerable.Empty<SelectListItem>(), new { @style = "display: inline-block", @class = "form-control" })
                                @Html.CheckBox("allSeller")
                                @Html.Label("По каждому")
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group" style="margin-right: 10px">
                                @Html.RadioButton("Proceeds", "Auto", false)
                                @Html.Label("По автомобилю")
                            </div>
                        </div>
                        <div class="col-sm-8">
                            <div class="form-group">
                                @Html.DropDownList("autoList", Enumerable.Empty<SelectListItem>(), new { @style = "display: inline-block", @class = "form-control" })
                                @Html.CheckBox("allAuto")
                                @Html.Label("По каждой")
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="row">
                        <div class="col-sm-12">
                            <input type="button" value="Выручка" class="btn btn-primary btn-block" style="height: 80px" />
                        </div>
                    </div>
                </div>
            </div>

在这种情况下，必须设置下拉列表，"display: inline-block"否则下一个标签将转移到下一行。这是为什么？如果我做错了什么，你能告诉我吗？

这是来自浏览器的代码：

<div class="row">
    <div class="col-sm-8">
        <div id="headTableProceeds">
            <table class="table table-bordered" style="margin: 0; table-layout: fixed">
                <thead>
                    <tr>
                        <th id="sel" style="display: none">Продавец</th>
                        <th id="auto" style="display: none">Автомобиль</th>
                        <th id="proceeds" style="display: none">Выручка</th>
                    </tr>
                </thead>
            </table>
        </div>
        <div id="bodyTableProceeds" class="container">
            <table class="table table-bordered">
                <tbody></tbody>
            </table>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <label for="">Фильтры детализации:</label>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <input id="Date" name="Date" type="checkbox" value="true" /><input name="Date" type="hidden" value="false" />
                <label for="">По дате</label>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-4">
                <div class="form-group">
                    <label for="" style="margin-right: 5px">С</label>
                    <input type="date" disabled />
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="" style="margin-right: 5px">По</label>
                    <input type="date" disabled />
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-10">
                <div class="row">
                    <div class="col-sm-4">
                        <div class="form-group" style="margin-right: 10px">
                            <input checked="checked" id="Proceeds" name="Proceeds" type="radio" value="Seller" />
                            <label for="">По продавцу</label>
                        </div>
                    </div>
                    <div class="col-sm-8">
                        <div class="form-group">
                            <select class="form-control" id="sellerList" name="sellerList" style="display: inline-block"></select>
                            <input id="allSeller" name="allSeller" type="checkbox" value="true" /><input name="allSeller" type="hidden" value="false" />
                            <label for="">По каждому</label>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-4">
                        <div class="form-group" style="margin-right: 10px">
                            <input id="Proceeds" name="Proceeds" type="radio" value="Auto" />
                            <label for="">По автомобилю</label>
                        </div>
                    </div>
                    <div class="col-sm-8">
                        <div class="form-group">
                            <select class="form-control" disabled="disabled" id="autoList" name="autoList" style="display: inline-block"></select>
                            <input disabled="disabled" id="allAuto" name="allAuto" type="checkbox" value="true" /><input name="allAuto" type="hidden" value="false" />
                            <label for="">По каждой</label>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2">
                <div class="row">
                    <div class="col-sm-12">
                        <input type="button" value="Выручка" class="btn btn-primary btn-block" style="height: 80px" />
                    </div>
                </div>
            </div>
        </div>

        <table style="display: none" id="equipTable" class="table table-bordered">
            <thead>
                <tr>
                    <th>Двигатель</th>
                    <th>Мощность</th>
                    <th>Год выпуска</th>
                    <th>Тип привода</th>
                    <th>КПП</th>
                    <th>Кузов</th>
                    <th>Максимальная скорость</th>
                    <th>Вес</th>
                    <th>Бак</th>
                    <th>Цвет</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td></td>
                </tr>
            </tbody>
        </table>
    </div>
    <div style="display: none" class="col-sm-4">
        <img id="autoPic" class="img-responsive" src="/Content/auto.jpg" />
    </div>
</div>