ブートストラップ3のコンテナ流体とコンテナを持つグリッド

Question

私はしばらくの間、html/cssを使用しています。そして私はブートストラップ3でこのようなグリッドの問題に遭遇したことはありません。私は50％幅（<div class="container-fluid">）と幅50％のdiv（<div class="container">）を組み合わせる方法を見つけようとしています。以下の写真の格子状：

Example of the template

• イエローオーバーレイ：<div class="container"></div>

問題は、彼らが幅の原因を一緒に動作しないことです。

これをどのようにシミュレートしますか？

<section> 
    <div class="container-fluid"> 
     <div class="col-sm-12 col-md-6 no-padding"></div> 
     <div class="container"> 
      <p>content</p> 
     </div> 
     </div> 
     <div class="col-sm-12 col-md-6 no-padding photo"></div> 
    </div> 
</section> 

Answer 1

私はあなたが達成しようとしているものを理解していた場合は、問題がいくつかあります。まず、コンテナ内に入れ子になっている列をラップするためには、依然として行divが必要です。また、デフォルトでは、コンテナにはいくつかのパディングがあるため、いくつかの基本的なCSSで削除する必要があります。 http://www.bootply.com/MKe7aJwKuc

私はあなたが何をしようとしてのマークを逃した場合、私に教えてくださいと私：ここ

はHTML構造も

<div class="container-fluid"> 
    <div class="row"> 
    <div class="col-lg-6" id="left"> 
     Left Side 
    </div> 
    <div class="col-lg-6" id="right"> 
     Right Side 
    </div> 
    </div> 
</div> 

あり、ここではあなたが一緒にプレイすることができます実際の例ですそれを再加工してあなたを助けようとすることができます。

Answer 2

は

<section> 
    <div class="container-fluid"> 

     <div class="col-sm-12 col-md-6 no-padding"></div> 
     <div class="col-sm-12 col-md-6 no-padding photo"></div> 

     <div class="container"> 
      <div class= "row"> 
       <div class="col-sm-12 col-md-6 no-padding">Content</div> 
       <div class="col-sm-12 col-md-6 no-padding photo"></div> 
      </div> 
     </div> 

    </div> 
</section>