highlight for Ruby text is mispositioned in the Web Inspector
[WebKit-https.git] / LayoutTests / fast / writing-mode / flipped-blocks-inline-map-local-to-container.html
1 <style>
2     img { width: 30px; height: 30px; background-color: red; }
3     .cover { position: absolute; background-color: green; opacity: 0.7; }
4 </style>
5 <div style="height: 500px;
6     background-color: lightyellow;
7     -webkit-writing-mode: horizontal-bt;
8     font: 40px ahem;
9     color: red;
10     -webkit-font-smoothing: none;
11 ">
12     <br>
13     <br>
14     <img id="t-0">
15     <ruby id="t-1">1<span id="t-2">2</span><rt id="t-3">3</rt></ruby>
16     <span>
17         <div id="t-4" style="display: inline-block">4<div id="t-5">5</div></div>
18     </span>
19     <span id="t-5">
20         <img id="t-6">
21     </span>
22     <span id="t-7">
23         7 <span id="t-8">8</span>
24     </span>
25 </div>
26 <script>
27     if (window.layoutTestController)
28         layoutTestController.dumpAsText();
29
30     for (var i = 0; i < 9; ++i) {
31         var element = document.getElementById("t-" + i);
32         var clientRect = element.getClientRects()[0];
33         var cover = document.createElement("div");
34         cover.className = "cover";
35         cover.style.width = clientRect.width + "px";
36         cover.style.height = clientRect.height + "px";
37         cover.style.top = clientRect.top + "px";
38         cover.style.left = clientRect.left + "px";
39         document.body.appendChild(cover);
40     }
41 </script>