02-18-2010, 08:20 AM | #1 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Bidirectional text in XHTML/CSS
Can anyone cast some light on this issue? I want to show a short piece of Hebrew (right-to-left) text in an otherwise left-to-right text, and I'm not sure how the CSS properties "direction" and "unicode-bidi" interact, especially with relation to "weak" characters (punctuation).
Consider the following test: Code:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:ops="http://www.idpf.org/2007/ops" xml:lang="es"> <head> <title>Bidirectional test</title> <style type="text/css"> body { font-size: 300%; } .hebrew1 { unicode-bidi: embed; } .hebrew2 { unicode-bidi: bidi-override; } .hebrew3 { direction: rtl; unicode-bidi: embed; } .hebrew4 { direction: rtl; unicode-bidi: bidi-override; } } </style> </head> <body> <p>No direction, embed<br/> <span class="hebrew1">שיר השירים</span>[29]</p> <p>No direction, bidi-override<br/> <span class="hebrew2">שיר השירים</span>[29]</p> <p>RTL, embed<br/> <span class="hebrew3">שיר השירים</span>[29]</p> <p>RTL, bidi-override<br/> <span class="hebrew4">שיר השירים</span>[29]</p> </body> </html> I gather that I don't need to suply a "direction" property, because the Hebrew characters already have an implicit directionality, and I shoud use "embed" to have the direction of the Hebrew words not affect the outside, but I don't know why specifying a direction (in hebrew3 and hebrew4) is breaking things so badly (se attached screenshot) Ideas? EDIT: In the source, I actually use numeric codes for the Hebrew characters, like this (remove spaces between & and #): & #1513;& #1497;& #1512; & #1492;& #1513;& #1497;& #1512;& #1497;& #1501 |
02-18-2010, 02:19 PM | #2 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
I guess it's enough to use the left-to-right mark (& #8206;) after the Hebrew text, to force the direction and bypass the Unicode bidi algorithm, like this:
& #1513;& #1497;& #1512; & #1492;& #1513;& #1497;& #1512;& #1497;& #1501;& #8206;(29) It seems the "direction" and "unicode-bidi" CSS properties are not really needed. |
Advert | |
|
02-19-2010, 03:23 AM | #3 |
eBook Enthusiast
Posts: 85,544
Karma: 93383043
Join Date: Nov 2006
Location: UK
Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6
|
If this is only a fragment of Hebrew in an otherwise Western European text, it's probably more portable to do it as a graphic image. I do that a lot with books that have short Greek quotes in them.
|
02-21-2010, 01:28 PM | #4 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Grrr... Opera, Firefox and Prince all render the Hebrew text fine now... but the ADE implementation on my Gen3 (and I guess all ADE implementations around) fails:
a) I does not obey the implicit directionality of the Unicode characters, so the Hebrew is rendered left-to-right. Apparently this was recognized 2.5 years ago, but it's still not fixed. b) It does not recognize :lang(xx) selectors, so I have to add classes on top of it. (I prefer to avoid the graphic image if possible, HarryT.) |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
CSS to "wrap" text between two .xhtml files? | december | Sigil | 28 | 12-06-2013 03:29 PM |
CSS for a Kindle-like text formatting? | december | Sigil | 2 | 04-24-2010 07:44 AM |
Please tell me about the "bidirectional dictionary" | horsewishr | Ectaco jetBook | 22 | 03-08-2010 08:26 AM |
Does it have to be XHTML 1.1 Strict? | AlexBell | ePub | 7 | 07-18-2009 07:51 AM |
xhtml document | deadite66 | iRex | 1 | 08-02-2006 03:15 PM |