title: Unable to get CSS variables working in Chrome 34
body: <p>I previously asked a very <a href="https://stackoverflow.com/q/18466569/1992129">similar question</a> for an older version of Chrome. However, I am again having a hard time getting CSS variables to work, this time in Chrome 34 (Version 34.0.1847.131 m) on Windows 7. (Have not attempted on other OSes.)</p>
  
  <p>I see that the syntax has been changed (for the old one, see the question linked above) and the new one is what is currently in the <a href="https://drafts.csswg.org/css-variables/" rel="nofollow noreferrer">CSS Variables spec.</a>:</p>
  
  <pre class="lang-css prettyprint-override"><code>:root {
    --main-color: #06c;
    --accent-color: #006;
  }
  
  /* The rest of the CSS file */
  h1#foo {
    color: var(--main-color);
  }
  </code></pre>
  
  <p>It's also important to note, I do have the <em>Enable experimental Web platform features</em> flag enabled. However, if you look at <a href="http://jsfiddle.net/Z4VWc/1/" rel="nofollow noreferrer">this fiddle</a> I can neither get the older syntax nor the new syntax working in Chrome 34. </p>
  
  <p>Googling it didn't turn up any known Chrome bugs. I'm curious as to if there is something new I have to do to get it working? Did I do something wrong? Has anybody else encountered this?</p>