bootstrap如何把表单select input button弄在一行

bootstrap很多折叠样式css都已经写好，可以直接用，很方便。但是，如果遇到一些bootstrap文档里面没有的例子，估计很多初学者都懵了，然后会折腾很久也未见得有效。今天主要讲如何把select input button弄在一行，因为直接用bootstrap的form-control样式会出现换行！只需要解决为何换行即可；form-control有个属性：width:100%，这个是产生换行的原因，所以覆盖form-control的width:100%样式为width:auto;即可。例子如下：

<div class="form-group">
    <div class="input-group col-xs-12">
        <div class="input-group-btn">
            <select name="type" class="form-control" style="width: auto;">
                <option value="1">全网</option>
                <option value="2">本站</option>
            </select>
        </div>
        <input type="text" name="keyword" id="keyword" class="form-control" placeholder="请您输入关键词">
        <span class="input-group-btn">
            <button class="btn btn-success" id="search_submit" type="submit">Go</button>
        </span>
    </div>
</div>

---

作者：竹音林
来源：CSDN
原文：https://blog.csdn.net/u010884130/article/details/49719265
版权声明：本文为博主原创文章，转载请附上博文链接！