title: How to move image in header?
body: <p>How to only move the image in the header?</p>
  <p>Here is the HTML I am using.</p>
  <pre><code>  &lt;header&gt;
    &lt;figure class=&quot;navbar&quot;&gt;
      &lt;a href=&quot;index.html&quot;&gt;
      &lt;img src=&quot;/images/logo.webp&quot; alt=&quot;Minecrft Logo&quot; title=&quot;Minecraft&quot; height=&quot;50&quot;&gt;&lt;/a&gt;
    &lt;/figure&gt;
    &lt;/header&gt;
  </code></pre>
  <p>And here is the CSS I am using:</p>
  <pre><code>.navbar {
      position: relative;
      left: 100px;
      background-image:url(../images/header_background.png);
  }
  </code></pre>
  <p>And it shows me this funny thing...</p>
  <p><a href="https://i.stack.imgur.com/WHYP4.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WHYP4.jpg" alt="enter image description here" /></a></p>
  <p>The entire header is moving together with the image :(</p>