CSS translate not working in IE11 on SVG g
Use the transform attribute
transform="translate(10, 0)"
Works like a charm on IE.
If you want to change it on the fly, use JS
IE11 supports the transform attribute in SVG even though it doesn't recognize the CSS style.
Fortunately, you can simply set the attribute to match the style using JavaScript:
var g = document.querySelector('g'),
transform = getComputedStyle(g).getPropertyValue('transform');
g.setAttribute('transform', transform);
svg {
width: 20px;
height: 20px;
}
g {
transform: translate(10px, 0);
-ms-transform: translate(10px, 0);
}
<svg viewbox="0 0 20 20">
<g>
<circle cx=10 cy=10 r=10 />
</g>
</svg>
if someone still needs this with jQuery this worked for me:
jQuery("g").each(function(){
transform = jQuery(this).css('transform');
console.log(transform);
jQuery(this).attr('transform',transform);
});