引导选择选项比输入选项宽

Question

我不知道为什么，但是在scrren尺寸1024 x 768上，我从select中选择的选项太大了。我怎样才能让这个选项像select一样宽？我想只在bootstrap 4上这样做，只使用bootstrap中的类，但我不知道或者这是可能的，我不知道为什么这个选择会这样。在更大的屏幕尺寸上，一切都可以。如何修复它？这是我的代码：

  <div class="row">
        <div class="col-sm-6" style="border: 1px solid black">
            <span class="font-weight-bold">Data</span>
                <form role="form">
                    <div class="form-group">
                    <label class="control-label">Choose</label>
                    <select class="form-control" name="docType">
                        <option value="paragon">Test1</option>
                        <option value="complaint">Test2</option>
                    </select>
                    </div>
                    <div class="form-group">
                        <label for="docNo">Data</label>
                        <input type="text" class="form-control" id="docNo">
                    </div>
                    <div class="form-group">
                        <label for="docDate">Data</label>
                        <input type="text" class="form-control" id="docDate">
                    </div>
                </form>
        </div>
      <div class="col-sm-6">
       Test            
      </div>
    </div>

Answer 1

通常，即使您使用的是引导程序，选项标记也不会显示大选项，但您可以尝试通过对 html 中的所有表单元素使用以下 css 代码来调整宽度。

.form-control
  {
    width:90%;
  }

Answer 2

您的CSS中是否有某些内容强制选项为静态像素大小，而不是允许引导的宽度只是自动的？