google-chrome - SVG线性渐变未显示在路径上（多个浏览器）

Question

我不明白为什么这个渐变在 Chrome/Firefox/IE 中不起作用。

它在 svg-editor（浏览器内部）和 Inkscape 中工作。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>

<svg xmlns="http://www.w3.org/2000/svg" height="300" width="85" version="1.1">
 <defs>
  <linearGradient id="fill_bg" x2="0.5">
   <stop stop-color="#8e8e8e" offset="0"/>
   <stop stop-color="#d6d6d6" offset="0.59766"/>
  </linearGradient>
 </defs>
 <g>
  <path d="m3.5,16.5c12.5,6.6507,21,6.6507,33,0v271.47c-12.5,7.1172-22,7.1172-33,0v-135.74-135.73,0.00002,0.00001,0.00002,0.00001z" stroke="#352c2c" fill="url(#fill_bg)"/>
 </g>
</svg>

描边显示正确，但填充完全缺失（透明），

我是否使用了浏览器不支持的东西？

Answer 1

抱歉，没关系我对所有路径元素都有 CSS 定义。

一旦我删除一切正常。