text align right relatively to parent G in SVG

I want to create SVG tooltip but I when I want align text to right I have a problem.

<g class="svgTootlip">
    <rect class="ttip" x="-100" y="-50" width="100" height="50" rx="2" ry="2"></rect>
    <text x="-90" y="-40">
        4 Dec 2014
    </text>
</g>

This group (d3TtipG) is a part of bigger SVG file and is transformed depends of the mouse position.

JS:

d3Container.on('mousemove', function () {
    cords = d3.mouse(this);
    tr_x = cords[0];
    tr_y = cords[1];
    if (tr_x > 23 && tr_y > 23) {
        ...
        d3TtipG.attr({
            style: 'transform: translate(' + ((tr_x < 560) ? tr_x + 110 : tr_x - 15) + 'px, ' + ((tr_y < 215) ? tr_y + 55 : tr_y - 10) + 'px)'
        });
    } else {
        hideViewFinder();
    }
});

Is there a cross browser way to force this text to stick on the right side of rect or g ?

Thanks!