HTML with Hebrew characters displaying weird

Asked 19/1, 2012 at 4:13 Answered 19/1, 2012 at 8:27

I have a chatbox that displays chats like this

Username: my chat message

Username2: chat message

But then someone registered using Hebrew characters on his username now when he posts on our chatbox it is displayed incorrectly. It would display like this

תירבע: 12345

Username: my chat message

Username2: chat message

This only happens if he posts numbers. Sample HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Chatbox</title></head>
<body>
    <div><span><a target="_BLANK" style="" href="#">&#1514;&#1497;&#1512;&#1489;&#1506;</a>:</span><span>12345</span></div>
    <div><span><a target="_BLANK" style="" href="#">&#1514;&#1497;&#1512;&#1489;&#1506;</a>:</span><span>this is not numbers so it is displayed correctly</span></div>
    <div><span><a target="_BLANK" style="" href="#">Username1</a>:</span><span>message1</span></div>
    <div><span><a target="_BLANK" style="" href="#">Useraname2</a>:</span><span>message2</span></div>
</body>
</html>

And the output of that is this

תירבע:12345
תירבע:this is not numbers so it is displayed correctly
Username1:message1
Useraname2:message2

How can I make it display correctly so that the username should appear first?

Imminent answered 19/1, 2012 at 4:13 Comment(10)

Could this be because Hindi reads from right to left? You didn't provide enough HTML/CSS to see if there is a rule specifying this. – Undergo 19/1, 2012 at 4:17

I also thinks that's the reason. The html code I posted can replicate my problem <a target="_BLANK" style="" href="#">תירבע</a>:12345 All I want is to negate the effect of the hindi so that it would not display right to left. – Imminent 19/1, 2012 at 4:26

So… can you provide more HTML/CSS? – Undergo 19/1, 2012 at 4:26

Try adding direction: ltr; to your styles. – Stalinism 19/1, 2012 at 4:29

@LoganSerman adding direction: ltr; has no effect @Tyler I already added html codes on my question – Imminent 19/1, 2012 at 4:36

Tyler Crompton is correct, this is caused by the right-to-left affinity of the characters. The page layout is actually correct. The reason numbers are treated differently from letters is that the letters have their own affinity which causes the overall to be left-to-right, whereas the numbers do not. If you desire to force this, you could insert a UTF-8 text ordering mark into your page, or use HTML properties (see i18nguy.com/markup/right-to-left.html for the latter). – Irredeemable 19/1, 2012 at 4:45

@Irredeemable Adding dir="ltr" solved the problem. But is it possible to specify this in the css? I already tried direction: ltr; and its now working. – Imminent 19/1, 2012 at 5:4

@deceze sorry, You were right its hebrew :) – Imminent 19/1, 2012 at 5:45

@TylerCrompton FYI hindi reads left to right like english. Not right to left – Mclain 19/1, 2012 at 9:13

@Mclain There was a mistake in the identification of the language. Hebrew does read from right to left. – Undergo 19/1, 2012 at 21:16

Add this CSS rule:

span a {
    unicode-bidi: embed;  
}

Baptlsta answered 19/1, 2012 at 8:20 Comment(0)

Use, in this case,

a { unicode-bidi: embed; }

In general, set unicode-bidi: embed on any element that may contain text with directionality opposite to that of surrounding text. Although e.g. simple embedding of Arabic words in English text (or vice versa) does not usually require this (since the situation is handled by the inherent directionality of letters), it is a useful precaution when digits, punctuation marks, or other directionally neutral characters may be involved.

The HTML counterpart is <bdo>, e.g. <bdo><a ...>...</a></bdo>, but it is as such unimplemented, so you would need to back it up with a { unicode-bidi: embed; } in CSS and, to cover old versions of IE, document.createElement('bdo') in JavaScript code.

The dir=ltr attribute on the a element may have the same effect, but this is a bug in browsers. By the HTML 4.01 specification, it should only affect directionality of directionally neutral text (Hebrew text surely isn’t), and dir=ltr is the initial value.

Indoaryan answered 19/1, 2012 at 8:27 Comment(0)

-1

You should look for the code of the language you like to use.

This URL could help you. http://www.w3schools.com/tags/ref_language_codes.asp

Counterclockwise answered 19/1, 2012 at 8:12 Comment(1)

Setting the language should not and does not have an effect on directionality: “User agents must not use the lang attribute to determine text directionality.” w3.org/TR/html4/struct/dirlang.html#h-8.2 – Indoaryan 19/1, 2012 at 8:30

Recommended topics

Hot tags