title: SVG is invisible but exists in DOM
body: <p>I have a bunch of line elements created with D3 but the strange thing is that they're appearing in the DOM and when I mouseover them I see it being highlighted but there isn't anything there, everything is just blank. The code somewhat looks like this and the CSS has some weird webkit-transform-origin stuff. Does anyone know what is wrong? (screenshot of issue: <a href="http://imgur.com/HRE01Gd" rel="nofollow">http://imgur.com/HRE01Gd</a>)</p>
  
  <pre><code>&lt;div&gt;
  &lt;svg width="1000" height="700"&gt;
  &lt;line x1="420" y1="470" x2="394.9078930250818" y2="369.0723716341295" id="id-1" style="stroke-    width: 10px; color: red;"&gt;&lt;/line&gt;
  &lt;/svg&gt;
  &lt;/div&gt;
  
  -webkit-transform-origin-x: 0px;
  -webkit-transform-origin-y: 0px;
  -webkit-transform-origin-z: initial;
  </code></pre>