How does one right-justify bootstrap pills with css


Tags: html,css,twitter-bootstrap

Problem :

I have a header with three sections, left, middle and right. I cant seem to come up with the proper css to make the column on the right (with 'email history' and 'back to list') float to the right side of the column. How can anyone tell me how this is done? Any help is appreciated.

<div class="col-sm-5" style="text-align:left">
    <button type="submit" class="btn btn-primary btn-lg navbar-btn">Save Contact</button>
</div>
<div class="col-sm-2" style="text-align:center">
   <h2 class="branding">Edit Contact</h2>
</div>
<div class="col-sm-5">
   <ul class="nav nav-pills">
      <li class="active"><a href="/GoHistory">Email History</a></li>
      <li class="active"><a href="/email_marketing/contact-list">Back To List</a></li>
   </ul>
</div>


Solution :

The easiest option is to add the class pull-right to the ul element. This will float the pills to the right.

Sidenote: you can replace those inline styles with the helper classes text-left (which is often redundant) and text-center.

Here's a bootply example: http://www.bootply.com/134139


    CSS Howto..

    Link on Link - How to activate JS code without parent link activation?

    How do I get Jquery to toggle display

    How to functionalize countdown?

    How to remove border-bottom of last div in a group - CSS

    Issue with changing how containers look based on values in an MD array

    Hiding and showing elements with their respective styles in Javascript

    ASP.NET - IIS 7 - DotNetNuke - How do I force browsers to reload the site's CSS?

    how to center horizontally div and span elements using css

    How to adjust the application with equal resolution in different browsers? [closed]

    How to add CSS styles to javascript

    How to set the style of the message in an SWT Text field?

    JavaFX editable tableview: How to change size and css of the TextField inside of TableCell?

    How to hide the third nested list in this css dropdown nested lists?

    how to center image + text in an li Element

    how to position nested list items?

    HTML - How do css/javascript files get loaded?

    Add background to first letter of a row of text. How?

    How to align radio buttons inside a DIV?

    How do I suppress errors in IntelliJ Idea 12

    css: how to target p a img

    What is cufon and canvas and how to overwrite them

    How to animate searchbox length from focusing on the textbox class CSS3?

    How do CSS grid systems save time when implementing designs that aren’t grid-based?

    how to apply the css style only to child

    How to apply CSS page-break to print a table with lots of rows?

    How to set a css style to the last item of CListView?

    How to get a property from other class in CSS?

    How to get my app to fill the full height on mobile?

    How can I put two divs shaped as circles next to each other?

    Slide up/down effect with ng-show and ng-animate