title: Bootstrap - split background container full-width
body: <p>This is my sample code</p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
  
      &lt;div class="col-md-6" style="background-color:red; min-height:100px;"&gt;
        sample
      &lt;/div&gt;
  
      &lt;div class="col-md-6" style="background-color:yellow; min-height:100px;"&gt;
        sample
      &lt;/div&gt;
  
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and I have this</p>
  
  <p><a href="https://i.stack.imgur.com/Brk1i.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Brk1i.png" alt="container result"></a></p>
  
  <p>But I need this</p>
  
  <p><a href="https://i.stack.imgur.com/Kev5b.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Kev5b.png" alt="container-fluid"></a></p>
  
  <p>I can reach result that I want with container-fluid, but I need container...</p>