html - 将搜索图标放在文本框中

标签 html twitter-bootstrap

<分区>

我正在尝试将搜索图标放在文本框中。但是,它显示在行尾。

<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/

它的显示是这样的 enter image description here

最佳答案

只需从 input-group div 中删除 row 类, updated fiddle

关于html - 将搜索图标放在文本框中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43588575/

相关文章:

html - CSS:自组织 flex 元素

javascript - 在另一个 td 子项的表中查找 td

php - Bootstrap 输入字段和下拉按钮提交邮件表单

javascript - Bootstrap Tour如何只显示在一页上

jquery - Bootstrap 3 Datepicker -enabledHours() 需要一个数组参数

html - 将部分的边缘隐藏在其他部分后面

javascript - 内联元素的边框

javascript - 当我切换时我无法更改卡片的背景颜色

javascript - knockout 将行添加到创建列的 foreach 循环中

html - 如何在选择列表中添加图像?