title: getComputedStyle returns NULL in Firefox when trying to get value for "background", but works in Chrome
body: <p>SOLVED!!! Here is solution, just see what the problem was below.
  Firefox automatically converts <strong>rgba(126,47,182,0)</strong> to <strong>transparent</strong>, so the solution is to keep it close to zero, but not zero like this <strong>rgba(126,47,182,0.01)</strong> And do <em>var background = window.getComputedStyle(menu, null).getPropertyValue("background-image")</em>;</p>
  
  <p>CSS:</p>
  
  <pre><code>.header-menu--formats{
      background: linear-gradient(45deg, rgba(126,47,182,0) 0%, rgba(126,47,182,0) 25%, rgba(249,71,157,0) 80%, rgba(249,71,157,0) 100%);
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;nav class="header-menu header-menu--formats"&gt;menu&lt;/nav&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>var menu = document.querySelector('.header-menu');  
  var background = window.getComputedStyle(menu, null).getPropertyValue("background");
  console.log("BACKGROUND:", background);
  </code></pre>
  
  <p>This works perfectly fine in Google Chrome, but when I try to run it in Firefox <em>getComputedStyle</em> function return <em>null</em>. I tried getting other styles, it works, but not for <em>background</em>  </p>
  
  <p>Demo is here: <a href="https://jsfiddle.net/brootle/0ok72drj/" rel="nofollow noreferrer">simple demo</a></p>
  
  <p>My goal is to get computed background for an element.
  I need to get this value -> <strong>backgroundImage: linear-gradient(45deg, rgba(126, 47, 182, 0) 0%, rgba(126, 47, 182, 0) 25%, rgba(249, 71, 157, 0) 80%, rgba(249, 71, 157, 0) 100%)</strong> </p>