Twitter bootstrap 如何使按钮和文本框成为一行？

我在我的项目中使用了Bootstrap3.3.7

我有以下html代码：

<div id="savedQueryEditor" class="panel-group">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">Existing queries
                <a class="pull-left" data-toggle="collapse" href="#collapse1"><i class="glyphicon glyphicon-collapse-down"></i></a>
            </h4>
        </div>
        <div id="collapse1" class="panel-collapse collapse">
            <div class="panel-body">
                <label>Enter new name</label>
                <div class="input-group">
                    <input class="form-control" type="text" id="savedQueryFilter" />
                    <input class="btn btn-default" type="button" id="saveCurrentQuery" value="save" disabled="disabled" />
                </div>
            </div>
        </div>
    </div>
</div>

这是

---

我的问题是如何将elementsbutton和text-Box都放在一行？

将表单控件包装为。表单内联请参见：

---

演示：

这是因为输入具有宽度：100%；如果按如下方式删除该选项：

.form-control {
   width:auto !important;
}

---

它应该可以工作，这里有一个更新的

Fiddle不是链接？？？@arjankol，已更新。你能添加Fiddle吗？试试这个更新的链接：。请注意，部分问题是您引用的是Bootstrap v3.0.0，而不是在Fiddle中更新的3.3.7链接。此外，为了防止您希望标签出现在字段上方，请尝试。这是由于引用的是Bootstrap v3.0.0而不是3.3.7，一旦CSS更新，用一个.form内联包装它将应用宽度：auto.@Conan好点！

.form-control {
   width:auto !important;
}