Bumping this as I came across similar issue, trying to make a responsive scene work in IE11. Is it still not possible to use percentage values on SVG child elements? This works in Chrome:
<g id="chicken-whole">...</g>
chickenMoveLeft = new TimelineMax({repeat: -1,transformOrigin:"50% 50%"});
chickenMoveLeft
.to("#chicken-whole", 2, {x: "-80%", ease: Power0.easeNone})
.to("#chicken-whole", 5, {x: "-80%", ease: Power0.easeNone})
.to("#chicken-whole", 1.2, {x: "0%", ease: Power0.easeNone})
.to("#chicken-whole", 2.5, {ease: Power0.easeNone});
but it doesn't work in IE11. If I use xPercent - it still won't do anything in IE11. Is there a workaround for this? Do I really have to wrap everything in individual div's?