在 Bootstrap 4 中的选择字段上显示内联标签

Question

我正在尝试向 Bootstrap 4 上的选择表单输入添加内联标签。我从 Bootstrap 3 的 stackoverflow 答案中复制了解决方案（可在此处获得），但它不起作用（我的代码如下）。我还尝试将“form-inline”添加到主表单标签（尽管我更喜欢不需要的解决方案），但即使这样也不起作用。我还尝试将以下代码的各个部分放在行和列中，但都不起作用。有什么建议？

<div class="row mt-2">
    <div class="form-group">

      <label for="from_year"><small><strong>Search from year:</strong></small></label>
      <select name="from_year" class="form-control form-control-sm" id="from_year">
        <option value="1980">1980 (default)</option>
        {% for year in from_years %}

        <option value="{{ year }}">{{ year }}</option>

        {% endfor %}
      </select>
    </div>
  </div>

Answer 1

请参阅实用程序下的 V4 文档。他们有一个内置d-inline或d-inline-block类可以应用于您的select元素，或者您可以将它包裹在span其中也将内联元素，但这有点马虎！

<div class="container">
    <div class="row mt-2">
        <div class="form-group">

            <label class="d-inline-block" for="from_year"><small><strong>Search from year:</strong></small></label>

            <select name="from_year" class="form-control form-control-sm d-inline-block" style="width: auto;" id="from_year">
                <option value="1980">1980 (default)</option>
                {% for year in from_years %}

                <option value="{{ year }}">{{ year }}</option>

                {% endfor %}
            </select>

        </div>
    </div>
</div>