Question

我正在使用bootstrap 3.3.7

CODE：

<div class="container">
    <div class="row">
        <form class="form-inline">
            <div class="form-group">
                <label for="select_year">Year</label>
                <select class="form-control" id="select_year" style="width: 96px"></select>

                <label for="select_month">Month</label>
                <select class="form-control" id="select_month" style="width: 96px"></select>

                <label for="select_day">Day</label>
                <select class="form-control" id="select_day" style="width: 96px"></select>
            </div>
        </form>
    </div>
</div>

这些代码用于日期选择表单。

但是当浏览器比769px更窄时，选择表单会占用新行。

如何删除这些新线？

如果浏览器较窄，如何使这些表单内联。

Answer 1

https://jsfiddle.net/bkzaksve/10/

为每个选择和标签对创建表单组。在表单标记中添加类

col-xs-12

像：

<form class="form-inline col-xs-12">

请检查上述链接以获得更清晰

如何防止此选择表单在引导程序上比769px窄时采用新行

1 个答案: