third_party/WebKit/LayoutTests/fast/writing-mode/ruby-text-logical-left.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <style>
   5             ruby { border: solid 5px cyan; }
   6         </style>
   7     </head>
   8     <body>
   9         Ruby text should be at the center of ruby base.
  10         <div id="test1" >
  11             <ruby>aaaaa<rt>b</rt></ruby><br>
  12         </div>
  13         <hr>
  14         <div id="test2" >
  15             <ruby>a<rt>bbbb</rt></ruby><br>
  16         </div>
  17         <hr>
  18         <div id="test3" style="-webkit-writing-mode: vertical-rl;">
  19             <ruby>aaaaa<rt>b</rt></ruby><br>
  20         </div>
  21         <hr>
  22         <div id="test4" style="-webkit-writing-mode: vertical-rl;">
  23             <ruby>a<rt>bbbb</rt></ruby><br>
  24         </div>
  25         <script>
  26             setTimeout(function () {
  27                 var verticalElement = document.getElementById("test1");
  28                 verticalElement.setAttribute("style", "-webkit-writing-mode: vertical-rl;");
  29                 verticalElement = document.getElementById("test2");
  30                 verticalElement.setAttribute("style", "-webkit-writing-mode: vertical-rl;");
  31                 var horizontalElement = document.getElementById("test3");
  32                 horizontalElement.setAttribute("style", "");
  33                 horizontalElement = document.getElementById("test4");
  34                 horizontalElement.setAttribute("style", "");
  35                 if (window.testRunner) {
  36                     testRunner.notifyDone();
  37                 }
  38             }, 0);
  39             if (window.testRunner) {
  40                 testRunner.waitUntilDone();
  41             }
  42     </script>
  43   </body>
  44 </html>