Горизонтальное выравнивание элементов - Semantic-UI-реакции

Я думаю, что самым простым способом было бы поместить их в контейнер display: flex и установить на него align-items: center, как объяснено здесь .

Не совсем уверен, понял ли я, что вы имеете в виду. Но чтобы не допустить смещения переключателей над полем ввода, вы можете расположить их с помощью системы семантики:

<Form>
  <Grid>
    <Grid.Column width={8} stretched verticalAlign="middle">
      <Form.Group inline className="no-margin">
        <Form.Field><Radio /></Form.Field>
        <Form.Field><Radio /></Form.Field>
        <Form.Field><Radio /></Form.Field>
        <Form.Field><Radio /></Form.Field>
        <Form.Field><Radio /></Form.Field>
       </Form.Group>
    </Grid.Column>
    <Grid.Column width={8}>
      <Form.Field>
        <Input
          label="Anden værdi"
          name="n"
          type='text'
          labelPosition='right'
        />
      </Form.Field>
    </Grid.Column>
  </Grid>
</Form>

Таким образом, вы можете добиться вертикального выравнивания с verticalAlign="middle". Проблема в том, что по умолчанию у семантических полей есть запас. Мы можем преодолеть это только путем добавления класса и написания одного аргумента дополнительно css:

.no-margin {
  margin: 0 !important;
}

(см. Codepen: https://codesandbox.io/s/m3y9zpw358 )