The purpose of the <bdi> tag in HTML5 is to isolate bidirectional text from it’s context. And that’s precisely what I’m looking for.
A left-to-right username displays like this:
Welcome, Generic User. [Logout]
With a right-to-left username it would turn into this awful thing:
Welcome, [tougoL] .resU cireneG
or even worse depending on the context, displaying everything around (not just the users’ name) in backwards.
The problem is that no browsers support the <bdi> tag yet, so I was wandering, is there a way to simulate it? What HTML tags could isolate it aswell? I know <span> and <div> do not.
I wouldn’t like to remove all BIDI characters, but the way I see it, the importance of my site to display properly > the right for bidirectional-language users to participate.
It shouldn’t. The text in an (eg) Arabic username would be rendered right-to-left but it wouldn’t affect the flow of Latin text around it.
The problem you may be thinking of is when a username includes a Unicode BDO (bi-directional override) control character. This affects all inline text following it, which is often a Bad Thing for web sites templating text into HTML.
Probably the simplest solution to this problem is input filtering to remove control characters, both the normal ASCII ones (0x00–0x1F) and the Unicode ones. There is a group of characters designated by Unicode and W3 as unsuitable for use in markup in this Note which web applications will generally want to remove from data. It includes the BDO characters and several others that can cause odd effects to leak outside of their own stretch of text.