11

Can I 

<svg>
  <text></text>
</svg>

svg text {
  content: 'a';
  font-family: 'Glyphicon Halflings';
}

?

It seems :before and :after pseudo-elements are not available, but I would be very happy to have my content set by css. Can I?

Augustin Riedinger
  • 20,909
  • 29
  • 133
  • 206
  • Related (and possibly even a dupe) of http://stackoverflow.com/questions/24026458/css-before-on-inline-svg – Harry Jul 24 '15 at 10:38
  • Have you tried it? That would seem to be the most obvious thing to do. – Paulie_D Jul 24 '15 at 11:13
  • 3
    I have tried my example, it doesn't work (`content` only works for `:before` and `:after`, which are not available in `svg` thanks to Harry's [link](http://stackoverflow.com/questions/24026458/css-before-on-inline-svg)). But there are other keys in CSS svg that don't exist in traditional CSS (eg. `fill`, `stroke`), so maybe there is one that sets the `` content? – Augustin Riedinger Jul 24 '15 at 12:41
  • So simply...the answer is "no"...you can't. – Paulie_D Jul 24 '15 at 13:09

1 Answers1

1

Not possible using pure CSS. Need to use simple JS:

function changeMyText()
{
    document.getElementById('MyText').textContent = "new text";
}

and create ID for your SVG text:

<svg>
    <text id="MyText"></text>
</svg>
G3ck
  • 204
  • 2
  • 10