Nested rows in bootsrap grid : I would create grid in Bootstrap 3.3.7 which is nested in another parent grid.
Here's the HTML

**Parent component** 

    <div>
      <div class="row">
        <div class="col-md-3 border">.col-md-3</div> // 
          <div class="col-md-9 border">
            <nested-app></nested-app> // should have 9 cols
        </div>
      </div>
    </div>

**Nested component** // Should have 9 cols 

    <div class="row">
      <div class="col-md-1 border">.col-md</div>
      <div class="col-md-3 border">.col-md-4</div>
      <div class="col-md-4 border">.col-md-4</div>
      <div class="col-md-4 border">.col-md-4</div>
    </div>

The problem is that the width of `col-md-1` inside nested component is not the same as `col-md-1` in parent component.

[here's an example][1] ( open in new windows for desktop view)

So my question how can I make same size of columns as parent grid in nested grid ?

  [1]: https://stackblitz.com/edit/angular-bootstrap-grid?file=app/app.component.ts