1 <!DOCTYPE html>
2 <html lang="en"><head>
3 <meta charset="utf-8">
4 <title>text-align: end, textarea, dir=auto on surrounding block</title>
5 <link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida">
6 <link href="https://drafts.csswg.org/css-text-3/#text-align-property" rel="help">
7 <meta content="text-align:end aligns inline-level content to the end edge of the line box – ie. since dir=auto is not inherited by textarea, to right in ltr context." name="assert">
8 <style type="text/css">
9 .test { text-align: end; }
10 /* the CSS below is not part of the test */
11 .test { border: 1px solid blue; margin: 20px; width: 300px; font-size: 24px; line-height: 1;}
12 </style>
13 </head>
14 <body>
15 <div id="instructions">Test passes if both words are right-aligned in both boxes.</div>
16 <div dir="auto">
17 <textarea class="test">latin
18 و·کمی</textarea>
19 </div>
20 <div dir="auto">
21 <textarea class="test">و·کمی
22 latin</textarea>
23 </div>
24 <!--
25 Notes:
26 The rationale for the expected outcome here is described at
27 https://drafts.csswg.org/css-writing-modes-3/#valdef-unicode-bidi-plaintext
28 "Because the unicode-bidi property does not inherit, setting bidi-override or plaintext on a block box will not affect any descendant blocks. Therefore these values are best used on blocks and inlines that do not contain any block-level structures. "
29 -->
30
31
32 </body></html>