title: NgFor grid System
body: <p>I have an array of [key:strings] that i show like this:</p>
  <pre><code>item1 item2 item3
  item4 item5 item6
  item7 item8 item9
  </code></pre>
  <p>however I have to add a dividing line, to print the results like this:</p>
  <pre><code>item1 item2 item3
  ----------------
  item4 item5 item6
  ----------------
  item7 item8 item9
  </code></pre>
  <p>This is a snippet of the code responsible for the layout</p>
  <pre><code>&lt;div class=&quot;row&quot;&gt;
      &lt;div class=&quot;col-8 mb-5&quot; *ngFor=&quot;let detail of details | keyvalue:originalOrder;&quot;&gt;
        &lt;b&gt;{{detail.key }}&lt;/b&gt;:{{ detail.value }}
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>With this solution adding a line obviously produce this result:</p>
  <pre><code>item1  item2  item3
  -----  -----  ----
  item4  item5  item6
  -----  -----  ----
  item7  item8  item9
  </code></pre>
  <p>How can I adapt the code to render a dividing line in a new row when I reach the end of column?</p>