Twitter bootstrap 引导预结束标志未正确对齐

我目前正在努力完成我的第一个项目，但我遇到了一个绊脚石，在过去的三个小时里，我一直在努力解决这个问题，但没有结果，我搜索了引导手册，用谷歌搜索了我能想到的所有东西，但我一直没有找到解决办法

我正试图在下面的表单输入中预先添加一个地址符号，但由于某些原因，它不想保持一致，如果有人能为我指出正确的解决方法，我将不胜感激，非常感谢

用户名
@
小文本在这里。

您忘记添加

输入组

类，下面是工作演示：

用户名
@
小文本在这里。

以下代码适用于引导4：

用户名
@

太棒了，非常感谢您的帮助，非常感谢，我确实有一种感觉，我错过了一个div，但没有意识到这就是我错过的地方。

        <div class="form-row">
            <div class="col-md-6 mb-3">
                <label for="inputUsername">Username</label>
                <div class="input-group-prepend">
                    <span class="input-group-text">@</span>
                </div>
                <input type="text" class="form-control" placeholder="Username">
                <small class="form-text text-muted">
                    Small text here.
                </small>
            </div>
            <div class="col-md-6 mb-3">
                <!-- placeholder -->
            </div>
        </div>

 <div class="form-row">
    <div class="col-auto">
  <label class="sr-only" for="inlineFormInputGroup">Username</label>
  <div class="input-group mb-2">
    <div class="input-group-prepend">
      <div class="input-group-text">@</div>
    </div>
    <input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username">
  </div>
</div>