title: Background Linear Gradient not showing on Safari
body: <p>I'm developing a website and i'm having trouble with Safari.
  I'm using a <code>background-image: -webkit-linear-gradient</code> that is working perfect on Chrome, Firefox, etc... but when it comes to Safari, the output is different.
  It is showing only on half of the screen.</p>
  
  <p>I'm using this style on the body:</p>
  
  <pre><code>body {
      background-image: -webkit-linear-gradient(-40deg, #000,#333 50%, #f9f9f9 50%);
      background-size: auto 1200px;
      -webkit-background-size: auto 1200px;
      background-repeat: no-repeat;
      background-attachment: scroll;
      top: 0;
      left: 0;
  }
  </code></pre>
  
  <p>I've tried searching for a solution, but so far nothing seems to work. I've tested changing the background size to cover but it doesn't give the output i intend, as well as setting <code>top: 0;</code> and <code>left: 0;</code> as shown in other question around stackoverflow, but that didn't work too.</p>
  
  <p>The link to the specific page i'm talking about is this one: <a href="https://dashiofficial.com/product/test-product-01" rel="nofollow noreferrer">https://dashiofficial.com/product/test-product-01</a></p>
  
  <p>Does anyone know the solution for this problem?
  Thanks in advance.</p>