Bootstrap'te bir araç çubuğunu doğru şekilde nasıl hizalarsınız?

Question

Birkaç düğmeleri olan bir araç çubuğu ve bir açılır, like this one var:

<div class="container"> 
    <div class="btn-toolbar" role="toolbar"> 
     <div class="btn-group"><a class="btn btn-default" role="button" href="">Invite People</a></div> 
     <div class="btn-group"><a class="btn btn-default" role="button" href="">Create Campaign</a></div> 
     <div class="btn-group"><a class="btn btn-default" role="button" href="">Edit</a></div> 
     <div class="btn-group"> 
      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Action <span class="caret"></span></button> 
      <ul class="dropdown-menu" role="menu"> 
       <li><a href="#">Action</a></li> 
       <li><a href="#">Another action</a></li> 
       <li><a href="#">Something else here</a></li> 
      </ul> 
     </div> 
    </div> 
</div> 

nasıl düzgün doğru örtüşüyor? Araç çubuğunun yanı sıra düğme gruplarının yanı sıra tüm düğmeleri içeren sağa itme düğmeli bir düğme grubunu da denedim. Bunların hiçbiri işe yaramadı.

Answer 1

Sadece sınıf 'çekme hakkına' sadece bu yüzden gibi süzülür sağ özelliğini senin araç çubuğunu vermek,-araç çubuğunu .btn veya css dosyasında ekleyebileceğiniz:

.btn-toolbar { 
 
    float: right; 
 
    }

Answer 2

böyle deneyin

: DEMO

<div class="container"> 
    <div class="btn-toolbar pull-right" role="toolbar"> 
..... 
</div></div> 

Bootstrap pull-right burada çalışıyor.