添加＆＃34;高级搜索按钮＆＃34;在搜索栏旁边

Question

我尝试过很多东西，但无法对齐＆＃34;高级搜索按钮＆＃34;在搜索栏旁边。你可以看到下面的图片。

以下是我使用的代码

<div class="row">
    <div class="col-md-12">

        <center>
            <form>
                <div class="form-group">
                    <div class="input-group" style="width:90%;">
                        <input class="form-control" name="search" placeholder="ISBN, Yazar yada Kitap adı yazınız" autocomplete="off" autofocus="autofocus" type="text">
                        <span class="input-group-addon" style="width:1%;"><a href="#"><span class="glyphicon glyphicon-search"></span></a></span>
                    </div>
                    <button class="btn btn-default btn-sm">Advanced Search</button>
                </div>
            </form>
        </center>

    </div>@*col-md-12*@

</div>@*row*@

由于

Answer 1

为按钮指定一个包含类.input-group-btn的包装div。

来源http://getbootstrap.com/components/#input-groups-buttons-multiple

Answer 2

如果你使用bootstrap，尝试使用“pull-right”或“pull-left”类取决于你想要什么。

有解决方案。我希望享受

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
    <div class="col-md-12">

        <center>
            <form>
                <div class="col-md-12" style="width:50%; margin-left:25%;">
				
				<div class="row">
                    <div class="input-group" >
                        <input class="form-control" name="search" placeholder="ISBN, Yazar yada Kitap adı yazınız" autocomplete="off" autofocus="autofocus" type="text">
                        <span class="input-group-addon" style="width:1%;"><a href="#"><span class="glyphicon glyphicon-search"></span></a></span>
                    </div>
                </div>
				<br />
				<div class="row">
					<button class="btn btn-default btn-sm pull-right">Advanced Search</button>
				</div>
				
                </div>
            </form>
        </center>

    </div>

</div>