Bootstrap: How to correctly centre a 6 column DIV inside of a fluid container
<p>I am curious to know what is the proper way of centring a DIV (col-lg-6) inside of a fluid container (12 columns) using Bootstrap? </p>

<p>Here is a screenshot of my design mockup, which explains what I am trying to achieve: <a href="http://d.pr/i/1iBrP" rel="nofollow">http://d.pr/i/1iBrP</a> .</p>

<p>So far I've read on Bootstraps website that this sort of thing can be achieved by adding an offset class e.g.:</p>

<pre><code>&lt;div class="container-fluid"&gt;
    &lt;div class="row"&gt;
      &lt;h1 class="col-xs-12 col-sm-10 col-md-6 col-sm-offset-1 col-md-offset-3"&gt;Auto cargo&lt;/h1&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Is it a correct way of doing it or is there a better (or preferable) way of achieving this task? </p>

<p>Also, what if the width of the DIV would be 7 columns, meaning that the number of columns on the side of the DIV would be different because 12 - 7 = 5 columns and 5 is not an even number?</p>

<p>Thank you very much in advance.</p>