Skip to content
This repository has been archived by the owner on Feb 1, 2022. It is now read-only.

E044 (Missing children within `.input group`)

Zac Echola edited this page Apr 23, 2015 · 1 revision

E044

.input-group must have a .form-control and either .input-group-addon or .input-group-btn.

.input-groups are meant to contain both a .form-control and at least one addon such as .input-group-addon or .input-group-btn. Omitting the addon can cause the .form-control to lose styling. Omitting the control doesn't make sense and causes some styles to be lost. Ensure you have all the required element with the correct classes within an .input-group.

Wrong:

<div class="input-group">
  <input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">
</div>

<div class="input-group">
  <span class="input-group-addon" id="basic-addon1">@</span>
</div>

Right:

<div class="input-group">
  <span class="input-group-addon" id="basic-addon1">@</span>
  <input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">          
</div>

<div class="input-group">
  <input type="text" class="form-control" placeholder="Search for...">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button">Go!</button>
  </span>
</div>
Clone this wiki locally