Twitter Bootstrap column not right aligning

Question

I am trying to have a row across my screen, with Login information on the left, and then some other info on the far right, right justified. This is my unsuccessful attempt:

<div class="container well">     <div class="row">         <div class="col-lg-6">             @(Session["CurrentUserDisplay"] != null ? "Welcome, " + @Session["CurrentUserDisplay"] : "Not logged in")         </div>         <div class="col-lg-6 pull-right">Active Portfolio: @(Session["ActivePortfolioName"].ToString())          </div>     </div> </div> 

But the 2nd column is sitting in the middle of the row, so seems it's not right justified in the 'cell'. Can anyone guide me to get this right?

Answer 1

Instead of pull-right use text-right.

text-right class aligns the content of that element to right by using text-align: right.

pull-right class aligns the element itself by using float:right.

Answer 2

I think you need to use offset. Add the class col-md-offset-*

You can read more in doc: http://getbootstrap.com/css/#grid-offsetting