Can I use two col-md-6 inside a col-md-8 or must I use two col-md-4?

<div class="row">
 <div class="col-md-8">
    <div class="row">   
        <div class="col-md-6">
        </div> 
        <div class="col-md-6">
        </div> 
    </div>

 </div>

 <div class="col-md-4">
 </div> 
</div>

Can I consider a col-md-8 as a col-md-12 if I insert a <div class="row"> inside the col-md-8?

I tried it and it offers me the required result, but is it proper?

Can I use two col-md-6 inside a col-md-8 or must I use two col-md-4?

<div class="row">
 <div class="col-md-8">
    <div class="row">   
        <div class="col-md-6">
        </div> 
        <div class="col-md-6">
        </div> 
    </div>

 </div>

 <div class="col-md-4">
 </div> 
</div>

Can I consider a col-md-8 as a col-md-12 if I insert a <div class="row"> inside the col-md-8?

I tried it and it offers me the required result, but is it proper?

• javascript
• twitter-bootstrap

• Yes. It should work as you have it. Why are you asking? – isherwood Commented Feb 16, 2015 at 16:58
• Yes, this is exactly how it's support to be :) Enjoy :) – Milkmannetje Commented Feb 16, 2015 at 16:58
• Yes because col-md-6 has width: 50%, but maybe insted on row use col-md-12 and so the html will be more clear. That depends on your style – Raulucco Commented Feb 16, 2015 at 16:59
• @isherwood I wasn't sure if I had to use two col-md-4 instead (4+4 = col-md-8) – Hello Lili Commented Feb 16, 2015 at 17:02
• 2 Looking at the applied CSS gives clues. The .col-md-6 class applies a 50% width. – isherwood Commented Feb 16, 2015 at 17:09

1 Answer 1

Per the Bootstrap documentation:

To nest your content with the default grid, add a new .row and set of .col-sm-* columns within an existing .col-sm-* column. Nested rows should include a set of columns that add up to 12 or fewer (it is not required that you use all 12 available columns).

So, yes you can.