Раскрывающееся отображение сверху, а не снизу в Firefox

Question

Я использую Bootstrap 4 Cards и фреймворк select2.У меня есть основной выпадающий список внутри тела карты, но это, показать наверх в Firefox.Тем не менее, отлично работает в Google Chrome.Я не могу понять почему.Как сделать так, чтобы отображалось дно без заданной высоты?

   <div class="card-body">
    <div class="form-row">
      <!--<label for="email" class="mr-sm-2">CIF:</label>
      <input type="email" class="form-control mb-2 mr-sm-2" id="email">-->


      <select class="js-example-responsive js-example-basic-single" style="width: 50%">

        <optgroup label="...">
          <option>...</option>
          ...
      </select>

      <script>
        $(document).ready(function () {
          $('.js-example-basic-single').select2();
        });
      </script>
    </div>
  </div>

Спасибо.