CODEWITHSUNDEEP
twitter-bootstrap
JulianJ
JulianJ

Reputation: 1317

How to put a button on the same line as some text?

I am using bootstrap 3 and trying to place a button on the same line as some text without luck. I've made a fiddle here. What am I missing? Many thanks.

<div class="container">
 <div class="col-xs-12 col-md-6 col-sm-8 col-lg-6 center-block">
 <br>
<p>Put the button on the same line as this text.</p>

<span class="pull-right">
<button type="button" class="btn btn-default btn-small" name="submit" id="submit">+ Add Me</button></span>
<br>
 </div>
  </div>

Upvotes: 3

Views: 12826

Answers (3)

AzizurRahamanCA
AzizurRahamanCA

Reputation: 170

i've made a slight change to your code to put the button on the same line. Here's how it looks like now-

<div class="container">
    <div class="col-xs-12 col-md-6 col-sm-8 col-lg-6 center-block">
     <br>
     <p>Put the button on the same line as this text. <span class="pull-right">
     <button type="button" class="btn btn-default btn-small" name="submit" id="submit">+ Add Me</button></span></p>
     <br>
    </div>
    </div>

Upvotes: 3

Hansraj Systematix
Hansraj Systematix

Reputation: 104

Try this 

<div class="container">
 <div class="col-xs-12 col-md-6 col-sm-8 col-lg-6 center-block">
 <br>
<p>Put the button on the same line as this text.</p>

<span class="pull-right">
<button style =" margin-top:0px;" type="button" class="btn btn-default btn-small" name="submit" id="submit">+ Add Me</button></span>
<br>
 </div>
  </div>

Upvotes: 0

Mistalis
Mistalis

Reputation: 18269

Create a div containing your button and then pull-right it:

<div class="container">
  <span>Put the button on the same line as this text.</span>
  <div class="pull-right">
    <div class="btn btn-small">+ Add Me</div>
  </div>
</div>

Try it on JSFiddle.

Upvotes: 1

Related Questions