Files
sousa-gecko/testing/web-platform/tests/css/css-ruby/ruby-overhang-spaces-002-ref.html
T
Minseong Kim 6e4c1eb708 Bug 2038597 [wpt PR 59785] - [ruby-overhang] Support overhang for space, NBSP, other space separator, a=testonly
Automatic update from web-platform-tests
[ruby-overhang] Support overhang for space, NBSP, other space separator

This CL implement support for ruby-overhang: spaces, which allows ruby
annotations to overhang adjacent spaces, including preserved white
space, no-break space (U+00A0), and other space separators.

The implementation sums the widths of consecutive whitespace or control
items surrounding the current ruby column. To prevent annotations from
overlapping with adjacent ruby column, the `end_overhang` is stored in
`InlineItemResultRubyColumn`. The next ruby column uses this value to
avoid overlapping.

This CL also adds new WPTs to verify the behavior across vertical
writing modes, complex case with tabs and ideographic spaces, other
space separators.

Support for overhanging fullwidth opening/closing punctuation and
middle dots will be implemented in a following CL.

There is no behavior change unless the CSSRubyOverhang runtime flag is
enabled.

Spec: https://drafts.csswg.org/css-ruby-1/#ruby-overhang
Bug: 499042741, 366873207
Change-Id: Icfbf52ab5436b554c258daa6510d428f90f602f9
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7809406
Commit-Queue: Koji Ishii <kojii@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Reviewed-by: Koji Ishii <kojii@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1628464}

--

wpt-commits: 8577acb6b06659906adeaa6aa81d6a5c93af69ca
wpt-pr: 59785
2026-05-13 04:23:12 +00:00

38 lines
1.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<meta charset="UTF-8">
<title>test reference</title>
<style>
ruby {
ruby-overhang: spaces;
ruby-align: center;
}
div {
font-size: 20px;
border-left: 5px solid;
border-right: 5px solid;
width: max-content;
text-spacing-trim: space-all;
}
.test { border-color: orange; }
.measure { border-color: blue; }
</style>
<body lang="ja">
<p>Test passes if orange and blue lines are aligned.
<div class=test>あ<ruby>) あ (<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>」 あ 「<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>』 あ 『<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>】 あ 【<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〗 あ 〖<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〕 あ 〔<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〉 あ 〈<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>》 あ 《<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〙 あ 〘<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〛 あ 〚<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〞 あ 〝<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>〟 あ 〝<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>] あ [<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>} あ {<rt>ああああああああ</ruby>あ</div>
<div class=test>あ<ruby>⦆ あ ⦅<rt>ああああああああ</ruby>あ</div>
<div class=measure>あ) あ (あ</div>
</body>