将搜索图标放在文本框中

Question

我正在尝试在文本框内放置搜索图标。但是，它显示行的结尾。

<div class="row input-group">
    <input class="col-lg-3 col-md-3 col-sm-5 col-xs-5 form-control" type="text" id="searchroleName" placeholder="Search here"  aria-describedby="basic-addon2"/>
    <span class="input-group-addon fa fa-search"  id="basic-addon2"></span>
</div>

https://jsfiddle.net/9dxryetu/

它显示如下

Answer 1

从row div中删除input-group类， updated fiddle

Answer 2

<div class="form-group has-feedback">
    <label class="control-label" for="inputSuccess2">Name</label>
    <input type="text" class="form-control" id="inputSuccess2"/>
    <span class="glyphicon glyphicon-search form-control-feedback"></span>
</div>

Answer 3

结帐这个jsFiddle。问题是您没有正确实施.row包含.container-fluid以防止-15px边距。

https://jsfiddle.net/fLLkwaqw