 <p>There is no problem doing what you want, you just need to be carful with the HTML when you have nested columns. Here's a working example with fluid rows <a href="http://jsfiddle.net/panchroma/yYFMT/" rel="nofollow">http://jsfiddle.net/panchroma/yYFMT/</a> </p> <p>When using fluid rows, note that spans of the nested columns add to 12 and the HTML is </p> <pre><code>&lt;div class="row-fluid"&gt; &lt;div class="span8"&gt; &lt;div class="row-fluid"&gt; &lt;div class="span6"&gt;nested col&lt;/div&gt; &lt;div class="span6"&gt;nested col&lt;/div&gt; &lt;/div&gt; &lt;!-- end nested row --&gt; &lt;/div&gt; &lt;!-- end span 8 parent --&gt; &lt;div class="span4"&gt; span 4 &lt;/div&gt; &lt;/div&gt; &lt;!-- end row --&gt; </code></pre> <p>If you don't have fluid rows, the spans of the nested columns add up to the width of the parent, eg</p> <pre><code>&lt;div class="row"&gt; &lt;div class="span8"&gt; &lt;div class="row"&gt; &lt;div class="span4"&gt;nested col&lt;/div&gt; &lt;div class="span4"&gt;nested col&lt;/div&gt; &lt;/div&gt; &lt;!-- end nested row --&gt; &lt;/div&gt; &lt;!-- end span 8 parent --&gt; &lt;div class="span4"&gt; span 4 &lt;/div&gt; &lt;/div&gt; &lt;!-- end row --&gt; </code></pre> <p>Here's a working example of with non-fluid rows: <a href="http://jsfiddle.net/panchroma/MX6GK/" rel="nofollow">http://jsfiddle.net/panchroma/MX6GK/</a></p> <p>Good luck!</p>