1 <!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
4 Based on http://dbaron.org/css/test/bidi2_html by Dave Baron, dbaron@dbaron.org
5 Copied with permission on 2005-09-10
6 Modified with permission (rearranged to fit in 800x600 and changed to make more
7 testcases have the same expected layout).
9 <TITLE>Bidirectional Text Test
2 - HTML
</TITLE>
10 <meta http-equiv=
"Content-Type" content=
"text/html; charset=iso-8859-1">
11 <meta http-equiv=
"Content-Style-Type" content=
"text/css">
12 <LINK REL=
"copyright" HREF=
"/~dbaron/legal.html">
13 <STYLE TYPE=
"text/css">
14 p { text-align: left; }
16 table.pair { border-spacing:
0; margin-bottom:
0; }
17 table.pair td { padding:
0; }
20 .rtl { direction: rtl; }
21 .ltr { direction: ltr; }
22 .rle { direction: rtl; unicode-bidi: embed; }
23 .lre { direction: ltr; unicode-bidi: embed; }
24 .rlo { direction: rtl; unicode-bidi: bidi-override; }
25 .lro { direction: ltr; unicode-bidi: bidi-override; }
27 .embed { unicode-bidi: embed; }
28 .override { unicode-bidi: bidi-override; }
30 div.box { border:
1px green solid; display:inline-block; padding:
3px; margin:
3px; vertical-align:middle; }
35 <H1>Bidirectional Text Test
2 - HTML
</H1>
37 <p>This test is based on
<a
38 href=
"http://www.w3.org/TR/REC-CSS2/visuren.html#direction">CSS2 section
39 9.10</a> and
<a href=
"http://www.unicode.org/unicode/uni2book/ch03.pdf">Chapter
40 3</a> of the
<a href=
"http://www.unicode.org/unicode/uni2book/u2.html">Unicode
46 <p>In each box, all the lines should be the same.
</p>
48 <p class=
"pair">ABCDEFGHI
</p>
49 <p class=
"rtl pair">ABCDEFGHI
</p>
50 <p class=
"rtl pair">ABC
<span>DEF
</span>GHI
</p>
51 <p class=
"rlo pair">IHGFEDCBA
</p>
52 <p class=
"rlo pair">IHG
<span>FED
</span>CBA
</p>
53 <p class=
"rlo pair">IHG
<span dir=
"rtl">DEF
</span>CBA
</p>
54 <p class=
"rlo pair">IHG
<bdo dir=
"rtl">FED
</bdo>CBA
</p>
55 <p class=
"rlo pair">IHG
<span style=
"unicode-bidi: inherit">FED
</span>CBA
</p>
56 <p class=
"rlo pair">IHG
<bdo dir=
"ltr">DEF
</bdo>CBA
</p>
60 <table class=
"pair"><tr><td>ג</td><td>ב</td><td>א</td></tr></table>
61 <p class=
"pair">אבג</p>
62 <p class=
"pair embed">אבג</p>
63 <p class=
"pair override">גבא</p>
68 <table class=
"pair"><tr><td>ג</td><td>ב</td><td>א</td><td> </td><td>A
</td><td>B
</td><td>C
</td><td> </td><td>ו</td><td>ה</td><td>ד</td></tr></table>
69 <p class=
"pair">אבג ABC
דהו</p>
70 <p class=
"pair rtl">דהו ABC
אבג</p>
74 <table class=
"pair"><tr><td>ג</td><td>ב</td><td>א</td><td> </td><td>A
</td><td>B
</td><td>C
</td><td> </td><td>ו</td><td>ה</td><td>ד</td><td> </td><td>D
</td><td>E
</td><td>F
</td><td> </td><td>ט</td><td>ח</td><td>ז</td></tr></table>
75 <p class=
"pair">אבג ABC
דהו DEF
זחט</p>
76 <p class=
"pair">אבג <span>ABC
דהו</span> DEF
זחט</p>
77 <p class=
"pair">אבג <span dir=
"ltr">ABC
דהו DEF
</span> זחט</p>
78 <p class=
"pair">זחט <span dir=
"rtl">DEF
דהו ABC
</span> אבג</p>
79 <p class=
"pair">דהו <span dir=
"rtl">ABC
אבג</span> DEF
זחט</p>
80 <p class=
"pair">דהו <bdo dir=
"rtl">CBA
אבג</bdo> DEF
זחט</p>
81 <p class=
"pair">אבג <bdo dir=
"ltr">ABC
והד</bdo> DEF
זחט</p>
82 <p class=
"rtl pair">זחט <bdo dir=
"ltr">ABC
והד</bdo> DEF
אבג</p>
86 <table class=
"pair"><tr><td>ג</td><td>ב</td><td>א</td><td> </td><td>A
</td><td>B
</td><td>C
</td><td> </td><td>ו</td><td>ה</td><td>ד</td><td> </td><td>D
</td><td>E
</td><td>F
</td><td> </td><td>G
</td><td>H
</td><td>I
</td><td> </td><td>ט</td><td>ח</td><td>ז</td></tr></table>
87 <p class=
"pair">אבג ABC
דהו DEF GHI
זחט</p>
91 <table class=
"pair"><tr><td>F
</td><td>E
</td><td>D
</td><td> </td><td>ו</td><td>ה</td><td>ד</td><td> </td><td>C
</td><td>B
</td><td>A
</td><td> </td><td>ג</td><td>ב</td><td>א</td><td> </td><td>G
</td><td>H
</td><td>I
</td><td> </td><td>ט</td><td>ח</td><td>ז</td></tr></table>
92 <p class=
"pair">אבג <bdo dir=
"rtl">ABC
דהו DEF
</bdo> GHI
זחט</p>
96 <table class=
"pair"><tr><td>ג</td><td>ב</td><td>א</td><td> </td><td>A
</td><td>B
</td><td>C
</td><td> </td><td>F
</td><td>E
</td><td>D
</td><td> </td><td>ו</td><td>ה</td><td>ד</td><td> 
</td><td>G
</td><td>H
</td><td>I
</td><td> </td><td>ט</td><td>ח</td><td>ז</td></tr></table>
97 <p class=
"pair">אבג ABC
<bdo dir=
"rtl">דהו DEF
</bdo> GHI
זחט</p>
99 <hr title=
"Beginning of Footer">
101 <P><A HREF="http://validator.w3.org/check/referer" TITLE="W3C HTML Validator"><img src="../../images/vh40" ALT="Valid HTML 4.0!" height="31" width="88"></A></P>
104 <A HREF=
"./">CSS Testing Information
</A>,
105 <A HREF=
"../../">David Baron
</A>)
106 <P><A HREF=
"/" TITLE=
"David Baron's Homepage">LDB
</A>,
107 <A rev=
"made" href=
"mailto:dbaron@dbaron.org" TITLE=
"Send e-mail to David Baron">dbaron@dbaron.org
</A>,
2001-
06-
05</P>
108 <P>Modified and used with the author
’s permission.
</P>