svgで「温度」を表示するようなテキストボックスを配置したいのですが、以下の条件にあるテキストボックスを書くことができず困っております。
- 単位部分が右側に固定
- 数値は単位の左側から右寄せで表示(text-align:rightのような)
どのように記載すればよいかご教授いただきたいです。
<svg id="111" x="000" y="200" width="100" height="19">
<g>
<rect width="100%" height="100%" fill="#ff0000"/>
<text font-weight="bold" font-size="18px" x="5" y="16.875" fill="#000000" >
<tspan id="1">19.5</tspan>
<tspan id="2">℃</tspan>
</text>
</g>