Geek Answers Handbook

Built-in bootstrap elements

So, at the top of my page, I have a facebook header and logo. Here is a working example: fiddle

So, everything is in a neat line at the top of the page. However, I want the logo and text Join us on... be on the right side, and the title stays where it is. I tried adding class="pull-right" to the 2nd and 3rd <li> elements like this . But you can see how this really screws up the vertical alignment. Besides the alignment, how I want it to look.

Any ideas on how to fix the alignment?

+4
source share
2 answers

You can apply pull-right on li . In addition, H4 will cause a break, so you must put img and "Join Us ..." inside H4.

Try the following:

 <ul class="inline"> <li><h3 class="muted">Heading</h3></li> <li class="pull-right"> <div class="media"> <h4 class="media-heading"> <a href="#"> <img src="http://cache.boston.com/universal/site_graphics/facebook/facebook_logo_36x36.png" style="max-width:100%;" alt="Join us on Facebook" /> </a> Join Us on Facebook </h4> </div> </li> </ul>
+4
source

you must add another element and give it a pull-right class. Your connection code should be in that.

So you should like the following:

 <ul> logo </ul> <ul class="pull-right"> join us </ul>
-1
source

More articles:


All Articles