Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-ruby/ruby-overhang-no-overlap.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
p {
font-size: 10px;
}
ruby {
font-size: 40px;
}
</style>
<p>
<ruby>安<rt>ān</rt></ruby>〓<ruby>装<rt>zhuāng</rt></ruby>〓<ruby>窗<rt>chuāng</rt></ruby>〓<ruby>户<rt>hù</rt></ruby>
</p>
<script>
test(() => {
const rts = document.querySelectorAll('rt');
const bounds2 = rts[1].getBoundingClientRect();
const bounds3 = rts[2].getBoundingClientRect();
assert_less_than_equal(Math.round(bounds2.right), Math.round(bounds3.left));
}, "Annotations should not be overlapped");
</script>