Bootstrap Row - Correct Alignment

Question

I have a header <h1> which is in the line <div> . I want to extend the style of <h1> , but place the button on the right side of the line.

I cannot figure out how to set the <span> value correctly so that the button stays on the right, but it also extends the entire amount of the line.

The only idea I have is to put <h1> in the div .span6 and then put the button in another div span pull-right, but that leaves an ugly empty space between the <h1> header style and the button.

It should also be liquid if we have two buttons on the right.

This is just an example of what I'm trying to do.

Answer 1

Your original question was a bit obscure, so I had to guess if something like this was what you were.

 <div class="container"> <div class="row"> <a href="#" class="btn pull-right">Button 2</a> <a href="#" class="btn pull-right">Button 1</a> <h1>My fancy title</h1> </div> </div> 

After editing the jsfiddle example, I would say that my solution should work if you use download. For some reason your css has .pull-right{float:none;} , resulting in pull-right not working.

Here's a simple demonstration of your code with the changes - this is the button in front of h1 and .pull-right{float:right;} added at the end of css

http://jsfiddle.net/Arkkimaagi/KFsM6/1/