css - Bootstrap Glyphicon 与文本框对齐

Question

我有以下 HTML:

<div class="row">
   <div class="col-md-6">
      <div class="form-group">
         <asp:Label runat="server" AssociatedControlID="txtAccountNumber" CssClass="control-label ">10 Digit Account Number</asp:Label>
     <asp:TextBox  onkeyup="isAccountValid();" CssClass="form-control input-sm" placeholder="Please enter your account number" runat="server" ID="txtAccountNumber" />
     <span id="isAccountValid" class="glyphicon glyphicon-ok" style="color: lightgreen;"></span>
      </div>
   </div>
   <div class="col-md-6">
      <div class="form-group">
     <asp:Label runat="server" AssociatedControlID="txtEmail" CssClass="control-label ">Email</asp:Label>
     <asp:TextBox CssClass="form-control input-sm" placeholder="Please enter your email" runat="server" ID="txtEmail" />
      </div>
   </div>
</div>

我很难将字形图标放在文本框旁边。有什么建议么？我更喜欢纯 CSS 或 Bootstrap 类...谢谢!

Answer 1

将 form-inline 添加到行 div 就可以了。

<div class="row form-inline">