title: Bootstrap: add margin/padding space between columns
body: <p>I'm trying to put some extra margin/padding space between columns on my Bootstrap grid layout. I've tried <a href="https://stackoverflow.com/questions/18738712/twitter-bootstrap-grid-system-spacing-between-columns">this</a> but I don't like the result. Here is my code:</p>
  
  <pre><code>    &lt;div class="row"&gt;
          &lt;div class="text-center col-md-6"&gt;
              Widget 1
          &lt;/div&gt;
          &lt;div class="text-center col-md-6"&gt;
              Widget 2
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>I want to add <code>margin: 10px</code> and <code>padding:10px</code>. Some people suggest to change their classes to <code>col-md-5</code> with <code>pull-left</code> and <code>pull-right</code>, but the gap between them will be too large.</p>