无法使GIF与输入组内的引导输入水平对齐

Question

我想将一个微调器对齐到输入框的右侧，但它位于下方：

<form>
    <div class="form-group">
        <div class="input-group">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-search"></i>
            </span>
            <input type="text" class="form-control" placeholder="Search" ng-model="searchTerm" ng-change="FetchNearby(searchTerm)">
        </div>
        <span><img alt="Logo" src="/Content/Images/ajax-loader.gif" /></span>
    </div>
</form>

Answer 1

这样的事情？

https://jsfiddle.net/1e0v352r/

我在你的跨度中添加了一个类，并将其移入.input-group

<form>
    <div class="form-group">
        <div class="input-group">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-search"></i>
            </span>
            <input type="text" class="form-control" placeholder="Search" ng-model="searchTerm" ng-change="FetchNearby(searchTerm)">
                <span class="logo_right"><img alt="Logo" src="/Content/Images/ajax-loader.gif" /></span>
        </div>

    </div>
</form>

并添加了一些css来定位它

.logo_right {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}