Jumbotron Alignment Issues

Question

I'm currently using the latest release of bootstrap 3.0.0

The issue is simple. In the jumbotron container I use how do i center align the text with the logo

I've been playing for hours, with col-md-* and with little luck.

In bootstrap 2.3.2 I achieved the effect of centering everything in hero by using .text-center and .pagination center (for the image?? - it worked)

http://jsfiddle.net/zMSua/

This fiddle shows the text and image im trying to center with bootstrap 3.0.0

Answer 1

why not offset the grid?

like this:

<div class="jumbotron">
      <div class="container">
        <div class="row well well-lg">
            <div class="col-md-6 col-md-offset-3">
                <h1 class="">Home of the</h1>
                <div class="">
                    <img src="http://www.harrogatepoker.co.uk/profile/HPL%20V%20Logo%20%20Revised%20and%20Further%20reduced.jpg" class="img-responsive text-center" />
                </div>
                <h2 class="">"All In", Fun!</h2>
            </div>
        </div>
      </div>

bootstrap has a 12 column grid if your main column has 6, you can offset it 3 and will leave you with:

3 columns 6 (main container) and 3 columns