Q:

How to center 3 boxes with gaps in bootstrap

I'm trying to center 3 boxes, with abit of space (gutter?) between them and also space from corner of page.
I tried class="col-sm-2 col-md-offset-1" (col-sm-2 to make them smaller, and offset 1 for the gap), but its not really centered to the middle of the page, and also on mobile each col is "streched" to the corners and i dont want that. 
any ideas?
thanks!

A:

You can wrap your content in a .well. Then the padding of the columns will be your gutters. Also, you cannot use .col-sm-3 if you want 3 columns to be centered.. you would have to use .col-sm-2 or .col-sm-4
<div class="col-sm-4">
  <div class="well">
    <h3>Column 2</h3>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
  </div>        
</div>

http://www.bootply.com/CUbF8SQg8q

