具有嵌套列邊距的自舉行問題

Question

如果我使用4列，則不存在第一個示例中的問題。但是，如果我在2列大小的列之間插入一列大小爲8的2列的列，列不會像第一個示例那樣寬，即使它合計爲12？

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-sm-3" style="background-color:lavender;">Column A</div> 
     <div class="col-sm-3" style="background-color:palegreen;">Column B</div> 
     <div class="col-sm-3" style=" background-color:palegoldenrod;">Column C</div> 
     <div class="col-sm-3" style="background-color:lightpink">Column D</div> 
    </div> 
</div> 

<div class="container-fluid" style="width:100%;background-color:blue;"> 
    <div class="row"> 
     <div class="col-sm-4 col-md4 col-lg-3" style="background-color:lavender;">Column A</div> 
     <div class="col-sm-4 col-md-4 col-lg-6 row"> 
      <div class="col-sm-12 col-lg-6 col-md-12" style="background-color:palegreen;">Column B</div> 
      <div class="col-sm-12 col-lg-6 col-md-12" style="background-color:palegoldenrod;">Column C</div> 
     </div> 
     <div class="col-sm-4 col-lg-3 col-md-4" style="background-color:lightpink">Column D</div> 
    </div> 
</div> 

Answer 1

每當你使用的是col-*你將有包裹他們row DIV中。

... 
<div class="col-sm-4 col-lg-6"> 
    <div class="row"> 
    <div class="col-lg-6">Column B</div> 
    <div class="col-lg-6">Column C</div> 
    </div> 
</div> 
... 

還請注意，我刪除了所有的col-*-12，你可以直接跳過他們，如果有具有相同的山坳跨度的大小，那麼你應該保持最小的一個，其餘都是多餘的。

你也可以驗證他們的官方example for grids。