Làm cách nào để đặt nút căn chỉnh ngay với Bootstrap?

Question

Tôi đang học Bootstrap. Cấu trúc là một thùng chứa trong một số ngữ cảnh. Ở dưới cùng của vùng chứa, tôi đặt một nút bên cạnh mô tả.

Bây giờ, tôi muốn đặt nút căn chỉnh sang bên phải mà không làm hỏng cấu trúc bootstrap. Tôi nên làm gì? Tôi đã đặt "phao: phải" thành kiểu nút, nhưng nó có vẻ xấu. Nút nằm ngoài nền "thông báo-cảnh báo" và không căn chỉnh theo chiều dọc. Bất kỳ phương pháp tốt hơn?

<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

Chỉ cần thêm một kéo bên phải lớp đơn giản để các nút, và chắc chắn rằng div container được làm rõ:

<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

Hãy thử điều này:

<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> 

Demo:

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>