Как бы я переместил заголовки ближе к полям ввода? - PullRequest
Новая
       2

Как бы я переместил заголовки ближе к полям ввода?

0 голосов
/ 01 февраля 2019

Я пытаюсь создать следующую форму Bootsrap.Единственная проблема заключается в том, что названия, такие как имя и фамилия, находятся слишком далеко над полями ввода.Как бы я опустил заголовки, чтобы они были ближе к соответствующим текстовым полям?Спасибо

Bootstrap form

'

<form class="needs-validation" novalidate>

  <div class="form-row">
    <div class="col-sm-1 mt-0 pt-0 pb-0 mb-1 ml-5">
      <label for="validationCustom01">First name</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom01"  value="<cfoutput>#nLast#</cfoutput>" placeholder="First name" required>
      <div class="valid-feedback">
        Looks good!
      </div>
    </div>

    <div class="col-sm-1 mt-0 mb-1">
      <label for="validationCustom02">Last name</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom02" placeholder="Last name" required>
      <div class="valid-feedback">
        Looks good!
      </div>
    </div>

    <div class="col-sm-1 mt-0 mb-1">
      <label for="validationCustom02">Other</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom02" placeholder="Other" required>
      <div class="valid-feedback">
        Looks good!
      </div>
    </div>  




  </div>
  <div class="form-row">
    <div class="col-md-2 mb-2 ml-5">
      <label for="validationCustom03">City</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom03" placeholder="City" required>
      <div class="invalid-feedback">
        Please provide a valid city.
      </div>
    </div>
    <div class="col-md-1 mb-2">
      <label for="validationCustom04">State</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom04" placeholder="State" required>
      <div class="invalid-feedback">
        Please provide a valid state.
      </div>
    </div>
    <div class="col-sm-1 mb-2">
      <label for="validationCustom05">Zip</label>
      <input type="text" class="form-control form-control-sm" id="validationCustom05" placeholder="Zip" required>
      <div class="invalid-feedback">
        Please provide a valid zip.
      </div>
    </div>
  </div>

  <button class="btn btn-primary ml-5" type="submit">Submit form</button>
</form>
...