如何让两个按钮排成一排？答案

【问题标题】：How to make two buttons make in one row?如何让两个按钮排成一排？
【发布时间】：2015-11-10 17:06:41
【问题描述】：

我有这个 HTML 代码：

<div class="form-group col-sm-12 row">
    <div class="col-sm-3 ">
        <div class="form-group row">
            <a ui-sref="inspectionsBuilder.view.step3" class="btn btn-block btn-info">
                Previus <span class="glyphicon glyphicon-circle-arrow-right"></span>
            </a>
        </div>
    </div>


    <div class="btn-group">
        <a href="#" class="btn btn-block btn-info" ng-click="builderStep4.save(true)">Save and...</a>
        <a href="#" class="btn btn-block btn-info" ng-click="builderStep4.save()">Save</a>
    </div>
</div>

这是它在视图中的样子：

我需要将Save 和Save and 按钮放在一排蚂蚁放在左侧，像这样：

我在实现它时遇到了一些困难，有什么想法吗？

提琴手：https://jsfiddle.net/99x50s2s/144/

【问题讨论】：

您可以在 Snippet 中创建类似的演示吗？
Display twitter bootstrap btn-group inline with text的可能重复

标签： html css twitter-bootstrap

【解决方案1】：

尝试.btn-group a {float:left;}

【讨论】：

添加对语句的作用以及为什么这样做的解释可能会很有用。它通常使提问者更清楚，进而帮助您的答案被接受。

【解决方案2】：

这是您提供的代码 sn-p 的可能解决方案，

https://jsfiddle.net/99x50s2s/145/

我已删除 btn-block 类并重新对齐 html，使其看起来符合您的预期。

HTML

<div class="row">
    <div class="col-xs-6">
        <a href="#" class="btn btn-info" ng-click="builderStep4.save()">Save</a>
         <a href="#" class="btn btn-info" ng-click="builderStep4.save(true)">Save and...</a>
         <a ui-sref="inspectionsBuilder.view.step3" class="btn btn-info pull-right">
                Previus <span class="glyphicon glyphicon-circle-arrow-right"></span>
            </a>
    </div>
</div>

【讨论】：