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

Question

我正在尝试将内联标签添加到 Bootstrap 4 上的选择表单输入中。我从 Bootstrap 3 的 stackoverflow 答案中复制了解决方案( available here )，但它不起作用(我的代码在下面)。我还尝试将“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>