title: Align and center images in a fixed div
body: <p>i have a very simple page with a fixed footer. On this footer, i'd like to place 5 images centered with equals distances between them.</p>
  
  <p>Here is my HTML/CSS : 
  <br>Footer div :</p>
  
  <pre><code>div.fixed {
      position: fixed;
      bottom: 0;
      right: 0;
      width: 100%;
      height: 9%;
      background-color: pink;
  }
  </code></pre>
  
  <p>And the HTML : </p>
  
  <pre><code>&lt;div class="fixed"&gt;
      &lt;img style="max-width: 80%; margin-left: auto; margin-right: auto; max-height: 80%;" src="images/icons/icon.png"&gt;
      &lt;img style="max-width: 80%; margin-left: auto; margin-right: auto; max-height: 80%;" src="images/icons/icon.png"&gt;
      &lt;img style="max-width: 80%; margin-left: auto; margin-right: auto; max-height: 80%;" src="images/icons/icon.png"&gt;
      &lt;img style="max-width: 80%; margin-left: auto; margin-right: auto; max-height: 80%;" src="images/icons/icon.png"&gt;
      &lt;img style="max-width: 80%; margin-left: auto; margin-right: auto; max-height: 80%;" src="images/icons/icon.png"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is what i obtain : </p>
  
  <p><a href="https://i.stack.imgur.com/Cpml7.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Cpml7.png" alt="screenshot of mobile browser display"></a></p>
  
  <p>I would like to display the red icons at the center. It should be responsive depending on the display resolution with the use of '%' values.
  I thought about doing a grid in the footer. But is there an easier way to do it ?
  Couldn't find anything about this on the web, hope it's not a duplicate !
  Thank you in advance for any help !</p>