Browsers Render Final Comma Of Right-to-left (rtl) Css Fields At Beginning Of Field

The HTML

foo,

fie, fum

surprisingly renders the results as ,foo fie, fum at the right e

Solution 1:

You could have the content within a inline element and then play around with unicode-bidi.

HTML

<div><span>fie,</span></div>
<div><span>fie, foo,</span></div>

CSS

div {
    direction: rtl;  
}

divspan {
    direction: ltr;
    unicode-bidi: bidi-override;
}

Fiddle: http://jsfiddle.net/dj7x7ee1/1/

Greetings

Axel