bidi-004a

Bidi Codes, White space, and Tree structure

WeasyPrint

This browser

Assertion
The final order of characters in a block container is the same as if markup had been stripped, consecutive space collapsed in logical order, and the resulting character sequence, including any bidi codes, had been passed to an implementation of the Unicode bidirectional algorithm for plain text that produced the same line-breaks as the styled text.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html lang="en">
 3  <head>
 4   <title>CSS Test: Bidi Codes, White space, and Tree structure</title>
 5   <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch">
 6   <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/inline/bidi/004.html" type="text/html">
 7   <link rel="help" href="http://www.w3.org/TR/CSS21/box.html#bidi-box-model">
 8   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#direction">
 9   <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#white-space-model">
10   <link rel="help" href="http://unicode.org/reports/tr9/">
11   <meta name="assert" content="The final order of characters in a block container      is the same as if markup had been stripped, consecutive space collapsed in      logical order, and the resulting character sequence, including any bidi codes,      had been passed to an implementation of the Unicode bidirectional algorithm      for plain text that produced the same line-breaks as the styled text.">
12   <style type="text/css">
13    div p { clear: left; border: solid; margin: 1em; padding: 0.5em; background: #FFFFCC; color: black; }
14    .test { line-height: 3em; }
15    .control { line-height: 3em; }
16    .a { color: navy; }
17    .b { color: orange; }
18   </style>
19  </head>
20  <body>
21   <p> The following two blocks should be identical, including overflow. (Force bidi: א) </p>
22   <div>
23    <p>
24     <span class="control a start"> aaa bbb ccc ddd eee </span> <br>
25     <span class="control b start"> fff                 </span>
26                                    ggg hhh iii
27     <span class="control a end">   jjj                 </span> <br>
28     <span class="control b end">   kkk lll mmm nnn ooo </span>
29    </p>
30    <p>
31     <span class="test a"> aaa         bbb          ccc &#x202E; eee                       ddd<br>
32                           jjj </span> iii          hhh          ggg <span class="test b"> fff<br>
33                           lll         kkk&#x202C; mmm          nnn                       ooo </span>
34    </p>
35   </div>
36  </body>
37 </html>