html - 字形搜索不在表单内

Question

我希望 glyphicon-search 图标位于表单内的最右侧，但它没有出现在表单内。谁能告诉我如何做到这一点？

嗯..我们不能覆盖 glyhicon-search 类来实现目标吗？如果是，那么如何(我正在尝试这样做，但我没有达到预期的结果，尤其是在缩小网页时)？

 <div  class="bar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div id="logo">  
            <a href="main.php">XYZ</a>
        </div>
        <div  class="col-xs-5 right-inner-addon ">
        <form class="form-inline" role="form">
             <div class="form-group has-feedback">
               <div class="row">
                <div class="col-xs-11">
                 <input type="text" class="form-control" id="inputSuccess4">
                 <span class="glyphicon glyphicon-search form-control-feedback"></span></div></div></div>
             </div>
        </form>
    </div>   
</div>

    .right-inner-addon {
        padding-top: 8px;
        padding-left:30px;

    }
    .right-inner-addon input {
        height: 30px;
        padding: 0px 10px;
    }
    .right-inner-addon i {
        position: relative;
        right: 0px;
        padding: 10px 12px;
        pointer-events: none;
    }

    .form-control{
        min-width: 400px; 
        max-width: 400px; 
        top: 7px;
}

Answer 1

将其作为背景图像应用于输入:<input type="text" class="form-control" id="inputSuccess4">或者给图标元素一个 display:block/inline-block 属性。