title: dynamically add div container in angular 6
body: <p><strong>How to dynamically add div containers in angular?.</strong> </p>
  
  <p>Please look at my html code. Whenever I will click "Add" button, one new div should add left side of that button. Dynamically it should add multiple containers based on how any clicks. Everything should add in horizontal wise. If it is more containers by default it should add scroll and it be in uniform. Can anyone please help me to do this in <code>angular 6.</code></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#content{
      width:100%;
      height:90px;
      border:1px solid black;
  }
  #contentInside{
      width:100px;
      height:70px;
      margin:7px;
      border:1px solid black;
      display:inline-flex;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="content"&gt;
      &lt;div id="contentInside"&gt;
      
      &lt;/div&gt;
      &lt;button (click)="add()"&gt;Add&lt;/button&gt; 
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I am new in angular. Please anyone help me to do this.</p>