Bootstrap input-group-sm和input-group-append不起作用

Question

我想在Bootstrap 4中使用带有附加图标或按钮的小型输入组。但是，当我使用示例代码并将“ -sm”添加到输入组类中时，该按钮将放置在下一行中。如何使用小的输入组并添加按钮？

这是代码

<div class="input-group-sm mb-3">
  <input type="text" class="form-control" placeholder="Search">
  <div class="input-group-append">
    <button class="btn btn-success" type="submit">Go</button>  
  </div>
</div>    

Answer 1

阅读文档：https://getbootstrap.com/docs/4.1/components/input-group/#sizing

应同时使用input-group和input-group-sm。

<div class="input-group input-group-sm mb-3">
    <input type="text" class="form-control" placeholder="Search">
    <div class="input-group-append">
        <button class="btn btn-success" type="submit">Go</button>
    </div>
</div>

https://www.codeply.com/go/xQqixpT60a