Number with apostrophe in direction rtl

Question

I'm currently working on localization of our site for right-to-left layout. We have numbers where every three digits are separated by single quote mark, e.g. -1'190.55. In rtl this number should be 1'190.55-. But when put 'direction: rtl' to the styles, the number becomes 190.55'1-. The numbers are put dynamically and could not be cut manually.

HTML:

<div>-1'190.55</div>

CSS:

div { direction: rtl }

Answer 1

This is possible, by putting a span in the div. So if you can change the HTML at all, that's the recommended way to do it.
Note: put the minus sign outside the span.

div {
  direction: rtl
}

div span {
   unicode-bidi:embed; direction:ltr;
}

<div>-<span>1'190.55</span></div>

If you can't change the HTML, but you can use JavaScript, then it's possible too, albeit in a more convoluted way.

var divs = document.getElementsByTagName('div');
for (var i = 0; i<divs.length; ++i) {
  var content = divs[i].innerHTML, min = content.indexOf('-')==0 ?1 :0;
  divs[i].innerHTML = content.substring(0,min)+'<span>'+content.substring(min)+'</span>';
}

div {
  direction: rtl
}

div span {
   unicode-bidi:embed; direction:ltr;
}

<div>-1'190.55</div>

Hope this helps!