title: Icons will not format in the navigation menu bar
body: <p>I am having an issue where the Facebook icon and the Instagram icon is not formatted in the navigation menu bar, it is just below it and won't go inside the bar. I need the icons to be to the right of the navigation bar with some space between the header and the icon, but they are lined up in the center together.  </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;Lunation Boards&lt;/title&gt;
      &lt;link rel = "icon" href="LogoBlack.PNG" type="image/SVG"&gt;
  &lt;/head&gt;
  &lt;style&gt;
      body {margin:0;}
      .Header {
          z-index: 100;
          position: fixed;
          top: 0;
          width: 100%;
          background-color: #000000;
          height: 70px;
      }
  
      @media screen and (max-width:680px) {
          .Header.responsive {position: relative;}
          .Header.responsive li.icon {
              position: absolute;
              right: 0;
              top: 0;
          }
      }
      @media (max-width: 960px){
      .Header {
          position: relative;
          display: flex;
          width: 86px;
          height: 15px;
          margin: 0 auto;
      }
      }
      .headerLogo{
          text-align: center;
          font-size: small;
          font-style: italic;
          font-family: Verdana;
          color: white;
      }
  
  &lt;/style&gt;
  &lt;body&gt;
  
  &lt;div class="Header" id="myHeader"&gt;
      &lt;a class = "headerLogo"&gt;
          &lt;a href="file:///C:/Noah's%20stuff/LunationBoards/Home.html" &gt;&lt;h1 style="color:white; font-family: Verdana; font-style: italic; font-size: x-large;
          text-align: center;"&gt;Lunation Boards&lt;/h1&gt;&lt;/a&gt;
          &lt;style&gt;
              a{text-decoration: none}
          &lt;/style&gt;
      &lt;/a&gt;
      &lt;a class = "Facebook" style = "padding-left: 1000px;"&gt;
          &lt;img src = "facebook-3-xxl.png"&gt;
      &lt;/a&gt;
      &lt;a class = "Instagram" style = "padding-left: 30px"&gt;
          &lt;img src = "instagram-32.png"&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;body&gt;
  </code></pre>