如何设置一个buttonalignment与Bootstrap？

我正在学习Bootstrap。 该结构在某种情况下是一个容器。 在容器的底部，我在描述旁边放了一个button。

现在，我想设置buttonalignment的权利没有打破引导结构。 我该怎么办？ 我已经设置了button样式的“float：right”，但是它看起来很糟糕。 该button位于“警报信息”背景之外，而不是垂直alignment。 有更好的方法吗？

<div class="alert alert-info"> <a href="#" class="alert-link">Summary:Its some description.......testtesttest</a> <button type="button" class="btn btn-primary btn-lg" style="float:right;">Large button</button> </div> 

Answer 1

只需向该button添加一个简单的拉右类，并确保容器div是clearfixed：

 <div class="alert alert-info clearfix"> <a href="#" class="alert-link">Summary:Its some description.......testtesttest</a> <button type="button" class="btn btn-primary btn-lg pull-right">Large button</button> </div> 

Answer 2

尝试这个：

 <div class="row"> <div class="alert alert-info" style="min-height:100px;"> <div class="col-xs-9"> <a href="#" class="alert-link">Summary:Its some description.......testtesttest</a> </div> <div class="col-xs-3"> <button type="button" class="btn btn-primary btn-lg">Large button</button> </div> </div> </div> 

演示：

http://jsfiddle.net/Hx6Sx/1/

Answer 3

 <div class="container"> <div class="btn-block pull-right"> <a href="#" class="btn btn-primary pull-right">Search</a> <a href="#" class="btn btn-primary pull-right">Apple</a> <a href="#" class="btn btn-primary pull-right">Sony</a> </div> </div>