Блог

В настоящее время я пытаюсь собрать форму с помощью Bootstrap 4 в React, однако, похоже, я не могу понять, как поместить текст справа от флажка и остаться на той же строке?

Вот что я пытаюсь получить:

И вот что я получаю:

Вот HTML, который я генерирую:

 <div class="col-12 mt-3 row">
    <div class="float-left primary form-check form-check-inline">
        <input type="checkbox" class="form-check-input">
        <label title="" class="form-check-label">
            I don't want to receive marketing emails. Note that your data may be transferred to a country outside of the EEA as described in our privacy policy.
        </label>
    </div>
</div>
  

Вы можете сделать div с классом float-left primary form-check form-check-inline как гибким и добавить align-items-start класс, а также удалить form-check-inline класс.

 <div class="col-12 mt-3 row">
    <div class="d-flex align-items-start primary form-check">
        <input type="checkbox" class="form-check-input">
        <label title="" class="form-check-label">
            I don't want to receive marketing emails. Note that your data may be transferred to a country outside of the EEA as described in our privacy policy.
        </label>
    </div>
</div>