svg图标在系统中引用的bug

bug如下：

 {/*数据源治理-mysql图标*/}
<symbol width='46px' height='46px' viewBox='0 0 46 46'>
  <title>数据源治理-mysql图标</title>
  <g stroke='none' strokeWidth='1' fill='none' fillRule='evenodd'>
    <g id='icon-private-mysql' transform='translate(-668.000000, -154.000000)'>
      <g id='Group-3' transform='translate(668.000000, 154.000000)'>
        <path d='M5.32907052e-14,0 L42,0 C44.209139,-4.33003142e-15 46,1.790861 46,4 L46,46 L5.32907052e-14,0 Z' id='Rectangle-Copy-10' fill='#FF9F00'></path>
        <path d='M10.1366187,12.8551901 L11.5556187,12.8551901 L14.2946187,19.1471901 L14.3276187,19.1471901 L17.0556187,12.8551901 L18.4746187,12.8551901 L18.4746187,></path>
      </g>
    </g>
  </g>
</symbol>

解决方案如下：去掉width和height，将id放入symbol属性中，其余不变

 {/*数据源治理-mysql图标*/}
<symbol id='icon-private-mysql' viewBox='0 0 46 46'>
  <title>数据源治理-mysql图标</title>
  <g stroke='none' strokeWidth='1' fill='none' fillRule='evenodd'>
    <g transform='translate(-668.000000, -154.000000)'>

起因：
1.去掉width和height，利用viewBox和font-size对图标设置大小
2.因为其余共事对symbol层id做了款式，放在g层不对

应用的定位，父级元素Card的position为relative，子集Iconfont的position为absolute