css - Bootstrap 在标签而不是表单字段中有反馈图标

Question

当结合使用 Bootstrap has-feedback 图标和标签时，图标显示在与标签相同的水平线上，而不是在表单字段中。

当我删除 <label for="bedr_naam">Bedrijfsnaam</label> 时它设置正确。

有什么建议吗？

<div class="container">
    <div class="col-md-5">
        <div class="form-group has-warning" id="div_bedrijfsnaam">
          <label for="bedr_naam">Bedrijfsnaam</label>
          <input type="text" class="form-control" id="bedrijfsnaam" name="bedrijfsnaam" value="'.$row['bedrijfsnaam'].'" onkeyup="validate()" onclick="validate()"><span class="glyphicon glyphicon-warning-sign form-control-feedback" id="bedrijfsnaam_status">
        </div>
    </div>

Answer 1

这是来自 documentation 的示例:

<div class="form-group has-warning has-feedback">
  <label class="control-label" for="inputWarning2">Input with warning</label>
  <input type="text" class="form-control" id="inputWarning2" aria-describedby="inputWarning2Status">
  <span class="glyphicon glyphicon-warning-sign form-control-feedback" aria-hidden="true"></span>
  <span id="inputWarning2Status" class="sr-only">(warning)</span>
</div>

仔细看，你的div#div_bedrijfsnaam没有has-feedback类，label没有control-label 类