title: background image and elements on it
body: <p>I need to put some elements on picture: </p>
  
  <p><a href="https://i.stack.imgur.com/YBbSE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YBbSE.png" alt="image background"></a></p>
  
  <p>What is better approach ?</p>
  
  <ul>
  <li><p>use img tag and align all elements on page with relative/absolute positioning ?</p></li>
  <li><p>or use background-image css property ?</p></li>
  </ul>
  
  <p>I've started with img tags but now I've decided for background-image. Sadly I'm suffering with basic problems, as when I'm using background property, image is only visible when there is something on it. I believe that is very simple problem, still.</p>
  
  <p>Thank you for helping me out :)</p>
  
  <p>SCSS </p>
  
  <pre><code>header {
      margin-top: 78px;
      width: 100%;
      background-image:url(../img/header.png);
      background-position: center;
      background-repeat: no-repeat;
  }
  </code></pre>