layout/reftests/writing-mode/1135361-ruby-justify-1.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <meta charset="UTF-8">
   5     <title>Test for bug 1135361</title>
   6     <style>
   7     body {
   8       font: 48px sans-serif;
   9     }
  10     div {
  11       display: inline-block;
  12       width: 3em;
  13       border: 1px solid silver;
  14       padding: .5em;
  15     }
  16     p {
  17       writing-mode: vertical-rl;
  18       -webkit-writing-mode: vertical-rl;
  19       -ms-writing-mode: tb-rl; /* old syntax. IE */
  20       text-orientation: upright;
  21       -webkit-text-orientation: upright;
  22       height: 4ch;
  23       text-align: justify;
  24       text-align-last: justify;
  25     }
  26     rt {
  27       font-size: 20%; /* ensure ruby is small enough that it won't affect inline spacing */
  28     }
  29     .t {
  30       color: transparent;
  31     }
  32     </style>
  33   </head>
  34   <body>
  35    <div>
  36     <p>
  37       <ruby>東<rt>to</rt></ruby><ruby class="t">京<rt>kyo</rt></ruby>
  38     </p>
  39    </div>
  40    <div>
  41     <p>
  42       <ruby class="t">東<rt>to</rt></ruby><ruby>京<rt>kyo</rt></ruby>
  43     </p>
  44    </div>
  45   </body>
  46 </html>