在输入组IN引导程序3的末尾添加“搜索”图标

Question

自2.4.3以来，表格已发生变化，而This之前已经有效，但现在不再有了。

这是我搜索栏的当前代码。

<li>
   <div class="input-group" id="fifteenMargin">
      <input type="text" class="form-control" placeholder="Search" name="srch-term" id="srch-term">
   </div>
</li>

这就是它目前的样子。

我希望它最终看起来像这样。

虽然这个问题与this one的关系很接近，因为它只是在外面有一个按钮而两者之间没有空格。这是如何进入搜索栏。

Answer 1

试试这个..

.input-group-btn > .btn {
  border-left-width:0;left:-2px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.input-group .form-control:focus {
 box-shadow:none;
 -webkit-box-shadow:none; 
 border-color:#cccccc; 
}

您可能希望使用特殊的CSS类，而不是覆盖所有input-group s

演示：http://bootply.com/86446

Answer 2

试

<div class="input-group">
    <span class="input-group-addon">
        <i class="glyphicon glyphicon-user"></i>
    </span>
    <input type="text" name="login" class="form-control" placeholder="Ваш логин">
</div>

Answer 3

您无法在技术上将其置于搜索框“内部”，而是通过绝对定位将您的提交放在搜索框中。

Answer 4

我用假div完成了它。
FIDDLE

.styleSelect {
    position:absolute;
    z-index:10;
  width: 168px;
  height: 34px;
  border: 1px solid #000;
}