html - 为什么我的输入表单不会粘在我的按钮上？

Question

就像我在标题中所说的，为什么我不能让输入表单与我的按钮保持一致？

我在我的 django 网站上使用 Bootstrap 。

  <div class="container" style="margin-top: 20%; margin-bottom: 20%";>
    <div class="col-md-6 col-md-offset-3">     
        <div class="row">
            <div id="logo" class="text-center">
                <h1 style="font-size:500%";>Zaira.io</h1><p style="font-size:120%";>Test</p>
            </div>
            <form role="form" id="form-buscar">
                <div class="form-group">
                    <div class="input-group">
                        <input id="1" class="form-control input-lg" type="text" name="search" placeholder="Input Website Url" required/>
                            <span class="input-group-btn">
                                <button class="btn btn-success btn-lg" type="submit">
                                    <i class="glyphicon glyphicon-search" aria-hidden="true"></i> Search
                            </button>
                        </span>
                    </div>
                </div>
            </form>
        </div>            
    </div>
</div>

Website Screenshot

Answer 1

看起来您正在尝试创建一个 input group .如果是这样，那么在显示为 <span class='input-group-btn'> 的行中, 改变类(class) input-group-btn至 input-group-append .这是 a fiddle以演示更改。