Arrange Radio Button

Question

На самом деле, я хочу расположить радио-кнопку, как показано ниже:

Но это так

Здесь код для вашей справки

HTML

<div  class="form-group">
<label *ngFor="let radiobutton of radioItems">
  <input type="radio" name="options" (click)="model.option = radiobutton"
  [checked]="radiobutton === model.option">{{radiobutton}}
</label>
</div>

CSS

.form-group {
        margin: 2px auto;
        width: 12rem;
        position: relative;
        overflow-wrap: break-word;
        column-count: 2;
        clear: both;
    }

Ссылка Демо здесь

Answer 1

Одним из решений будет использование flexbox:

.form-group {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        height: 100px;
        // Other properties.
    }

Демонстрация в реальном времени на StackBlitz: https://stackblitz.com/edit/radio-buttons-58ccoi