在右側響應按鈕的引導區

Question

在bootstrap中有一個問題，如何讓一個像div一樣的輸入組與裏面的一些內容和一個響應按鈕在右側。我希望按鈕總是在右側，這也是響應。我試着用我的代碼下面，但似乎這是不正確的。請參閱下面的演示。

.btn-custom { 
 
    position: absolute; 
 
    right: 5px; 
 
    height: 100%; 
 
    min-height: 100px; 
 
    top: -9px; 
 
    border-top-left-radius: 0px; 
 
    border-bottom-left-radius: 0px; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 

 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-md-6"> 
 
    <div class="well well-sm"> 
 
     <div class="row"> 
 
     <div class="col-xs-4"> 
 
      <img src="http://placehold.it/350x350" class="img-responsive img-circle" /> 
 
     </div> 
 
     <div class="col-xs-4"> 
 
      Lorem ipsum dolor sit. 
 
     </div> 
 
     <div class="col-xs-4 text-right"> 
 
      <a href="" class="btn btn-primary btn-custom">Go!</a> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
</div>

我wan't類似下面。

Answer 1

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 

 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-md-6"> 
 
    <div class="well well-sm"> 
 
     <div class="row"> 
 
     <div class="col-xs-4"> 
 
      <img src="http://placehold.it/350x350" class="img-responsive img-circle" /> 
 
     </div> 
 
     <div class="col-xs-4"> 
 
      Lorem ipsum dolor sit. 
 
     </div> 
 
     <div class="col-xs-4"> 
 
      <div class="input-group"> 
 
    <input type="text" class="form-control" placeholder="Text Field" aria-describedby="basic-addon2"> 
 
    <a href="#" class="input-group-addon btn btn-primary" id="basic-addon2">Go</a> 
 
</div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
</div>

Answer 2

你試圖用pull-right？

<div class="col-xs-4 text-right"> 
    <a href="" class="btn btn-primary btn-custom">Go!</a> 
</div>