title: Scrolling under a transparent fixed element
body: <p><a href="https://i.stack.imgur.com/1bDGa.png" rel="nofollow noreferrer">The problem image</a></p>
  <p>I am working on a page with a fixed header that has transparent background. And i need to make the content below it somehow when scrolled under this fixed header disappear like how it would act if the header was non-transparent.</p>
  <p>EDIT:
  Fixed it by adding the same background to the transparent fixed element as the body and by adding properties</p>
  <pre><code>background-position: center top;
  background-size: cover; 
  </code></pre>