title: css display flex not working properly on chrome and safari
body: <p>I used flexbox properties to make my section look like this:</p>
  
  <p><a href="https://i.stack.imgur.com/UxQeW.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UxQeW.jpg" alt="enter image description here"></a></p>
  
  <p>It works fine on Chrome but I noticed a few differences when I checked firefox and safari.</p>
  
  <p>This is how chrome looks like:
  <a href="https://i.stack.imgur.com/ZPOFh.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZPOFh.jpg" alt="enter image description here"></a></p>
  
  <p>But on Firefox, I am not managing to apply to margin of 1% like I want as the red signal shows:</p>
  
  <p><a href="https://i.stack.imgur.com/5cCiW.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5cCiW.jpg" alt="enter image description here"></a></p>
  
  <p>And on safari, the boxes are all one after the other:</p>
  
  <p><a href="https://i.stack.imgur.com/SxKBH.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SxKBH.jpg" alt="enter image description here"></a></p>
  
  <p>It is a WordPress Site and not live yet. But here is my html structure:</p>
  
  <pre><code>    &lt;section id="services"&gt;
  
          // here goes the title of the container
  
          &lt;div class="main-container col-lg"&gt;  
  
                 // here go all the box
  
           &lt;div class="services-container"&gt;    
  
                 // this one of the boxes              
           &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  </code></pre>
  
  <p>And the CSS:</p>
  
  <pre><code>#services {
      background-image: url("img/Services-background.jpg");
      background-color: red;
  }
  .col-lg {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      margin: initial;
      max-width: 100%;
  }
  .services-container {
      color: #d6d6d6;
      margin: 1%;
      max-width: 100%;
      width: 30%;
  }
  </code></pre>
  
  <p>How Can I make this work on all browsers?</p>