So you are facing the problem with bi-di text which is a piece of text that contains both directions ltr & rtl. And most probably you're using Arabic with English.
I'll start with the quick fix for those who just want to fix it & don't want to know more and then will provide links that will explain more about it.
Quick Fix:
So to solve this in your markup you add the following invisible characters in your markup
Arabic‮‭ English ‬ Arabic,
These characters will switch the direction to rtl,ltr and back again to rtl.
Example:
Check the examples in the fiddle below, to understand the solution better:
http://jsfiddle.net/3amzooo/ThKAE/1
Read More:
To gain a better understanding of the bi-di text, the algorithm used to render it and how browsers deal with it read the links below:
http://en.wikipedia.org/wiki/Bi-directional_text
http://www.w3.org/International/articles/inline-bidi-markup/
https://www.w3.org/International/questions/qa-bidi-controls
https://www.w3.org/International/questions/qa-bidi-unicode-controls
Comment below to let me know if this helped you solve a problem, or if you need any help solving a similar problem.
No comments:
Post a Comment