title: Bootstrap multi column layout
body: <p>I have to build a layout same as below using bootstarp.</p>
  
  <p><img src="https://i.stack.imgur.com/a9WPO.png" alt="enter image description here"></p>
  
  <pre><code>&lt;div class="container-fluid"&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-xs-64 col-lg-42"&gt;
          &lt;img class="img-responsive" src="&lt;%= asset_path( 'Thunderbolt-Display_3-5.jpg' ) %&gt;"&gt;
        &lt;/div&gt;
        &lt;div class="col-xs-64 col-lg-22"&gt;
          &lt;div class="row"&gt;
            &lt;div class="col-xs-64"&gt;
              &lt;img class="img-responsive" src="&lt;%= asset_path( 'Thunderbolt-Display_3-5.jpg' ) %&gt;"&gt;
            &lt;/div&gt;
            &lt;div class="col-xs-64 child-of-prmo-p2"&gt;
              &lt;img class="img-responsive" src="&lt;%= asset_path( 'Thunderbolt-Display_3-5.jpg' ) %&gt;"&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt; 
      &lt;/div&gt;  
    &lt;/div&gt;
  </code></pre>
  
  <p>Description:</p>
  
  <p>The first big image will take 42 column on lg device and second will take 22 column. I achieve the same layout but my problem is to put the space in-between images as per design. I put the spacing as well but while resizing its not working proper. </p>
  
  <p>The images which is being used is 5:3 aspect ration.</p>