Проблемы с меткой начальной загрузки и выравниванием поля ввода

Question

У меня есть следующая форма в приложении Angular с использованием Bootstrap 4. Я хочу, чтобы метка формы и текстовое поле ввода были в одной строке, но они не работают.Метка и поле ввода текста отображаются в отдельных строках.Я искал, но не мог найти лучшего ответа ::

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />

<div class="col-md-12">
  <form class="form-horizontal" [formGroup]="parentCategoryForm" autoComplete="off">
    <div class="form-group">
      <label class="control-label col-md-2" for="parent">Category name</label>
      <div class="col-md-10">
        <input type="text" formControlName="parentName" name="parentName" class="form-control" id="parentName" />
      </div>
    </div>
    <div class="btn-toolbar pull-right">
      <button type="button" (click)="cancel()" class="btn btn-outline-danger btn-sm mr-4">Cancel</button>
      <button type="submit" class="btn btn-outline-primary btn-sm">Submit</button>
    </div>
  </form>
</div>
</div>

Я следую инструкциям с этого сайта Создание горизонтального макета формы

Что я делаю не так?

Answer 1

пожалуйста, добавьте строку класса в группу форм

<div class="form-group row"> </div>

Answer 2

Используйте класс input-group .Следуйте Это