Как отключить радиус границы bootstrap входов в Angular

Question

Я использую bootstrap элементы управления вводом и пытаюсь отключить границу, установив для нее значение 0px, но она не работает.

Я видел много постов здесь, но ни один из них не работал для меня. Я попытался использовать !important и переместил классы css в основной файл style.css, и снова он не работает.

<div class="form-group">
   <select class="form-control" formControlName="manager" required #manager #manager (change)="selectedValueManager(manager.value)">
      <option value="">choose manager</option>
      <option *ngFor="let manager of this.flowManagers" value={{manager.id}}> {{manager.name}}</option>
   </select>
   <div class="invalid-feedback"></div>
</div>

css:

.form-group {
   border-radius: 0px;
}

Answer 1

Вам следует применить это правило к классу .form-control css, а также убедиться, что вы сначала загрузили boostrap.css, а затем ваш styles.css

.form-control {
    border-radius: 0;
}

Answer 2

Вы можете добавить класс rounded-0 к входу

Answer 3

Сделайте его более конкретным c, чем bootstrap:

    select.from-control {
          border-radius:0;
    }

Answer 4

Делай как ниже. Применить стиль к .form-control классу

.form-control {
    border-radius: 0 !important;
}