How to right-align an <svg>

[hungryBear]

Hi, 

I've just started app development and can't figure out how to align an <svg> group I'm using for a symbol & corresponding text. I know text elements can be right-aligned with 

text-anchor: end;

, but when I tried using that property on the entire group, my Versa 2 just ignored that line and kept rendering with a beginning anchor.

I know it's possible to set up a group with a right-end alignment because my clockface (Fitbit's "Simple") does it, but I'm not sure if you have to check and update the x-position with code or if there's an abstracted way to do it in pure css. Thanks for your help!

[Gondwana · Accepted solution]

There's no general style for right alignment. Most elements (including groups and symbols) have their left edge specified by x. However, you can set x to something like "100%-50" where 50 is the element's width.