title: Justify divs left in parent
body: <p>I have the following requirement.
  <a href="https://i.stack.imgur.com/N3NsR.png" rel="noreferrer"><img src="https://i.stack.imgur.com/N3NsR.png" alt="enter image description here"></a></p>
  
  <p>The green colored parent width will be varying depending on device width. I need all the boxes to be in the center of the parent.</p>
  
  <p>I have tried the following things already, but it didnt help me.    </p>
  
  <p><strong>Trial 1</strong><br>
  <code>Parent {text-align:center} box {display:inline-block}</code>. </p>
  
  <p>This resulted in following output<br>
  <a href="https://i.stack.imgur.com/2rd70.png" rel="noreferrer"><img src="https://i.stack.imgur.com/2rd70.png" alt="First trial result"></a>    </p>
  
  <p><strong>Trial 2</strong><br>
  <code>Parent {text-align:center} box{float:left}</code>. </p>
  
  <p>This resulted in following output    </p>
  
  <p><a href="https://i.stack.imgur.com/sRCDm.png" rel="noreferrer"><img src="https://i.stack.imgur.com/sRCDm.png" alt="Second trial result"></a>    </p>
  
  <p><strong>Trial 3</strong><br>
  <code>Parent {display:flex} box -&gt; justify-around &amp; justify-between</code> also didn't work.    </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.parent {
    text-align: center;
  }
  .item {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: red;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="parent"&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
    &lt;div class="item"&gt;&lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any help on this will be appreciated.</p>