Edit

Page

Page title:

Page body:

* 仕様書

[REFS[
- [7] [CITE@en[CSS Ruby Layout Module Level 1]], [TIME[2020-11-27T09:59:05.000Z]], [TIME[2020-11-27T12:31:27.122Z]] <https://drafts.csswg.org/css-ruby/>
]REFS]

* レンダリング

[FIG(short list)[ [8] [[CSS Ruby]]
- [CODE[ruby-align]]
- [[auto-hidding]]
]FIG]

* [CODE[display]] の Web 非互換問題

-
[234] [CITE@en[1746562 - ruby with display: inline mangles the position of the annotation characters]]
([TIME[2021-12-29 23:28:36 +09:00]])
<https://bugzilla.mozilla.org/show_bug.cgi?id=1746562>
-
[235] [CITE@en[www.ghibli.jp - Ruby element is not rendered correctly · Issue #96604 · webcompat/web-bugs · GitHub]]
([TIME[2021-12-29 23:29:23 +09:00]])
<https://github.com/webcompat/web-bugs/issues/96604>

[236] 
[[Firefox]] だけが実装している [[CSS Ruby]] の [CODE[display]] 指定が
[[Web互換]]ではないため、
[[Firefox]] でだけ表示が崩れる。
[[Firefox]] の開発者は仕様通りとして INVALID にした [SRC[>>234]]。

[9] 
[[Chrome]] も実装したら同じように崩れるだろと言っているけど、
もう何年も未対応のままで、しかも[[Web互換性]]の問題まで見つかったものを、
今後
[[Chrome]] や [[Safari]] が実装する日は来るのだろうか?
誰でも実装できて 
[[Web互換性]]の問題が無い形に
[[CSS Ruby]]
を作り直した方が良いような...

[11] [CITE[差別をなくすために差別を温存している? 『「社会正義」はいつも正しい』の読みどころを訳者・[[山形浩生]]が解説!|Hayakawa Books & Magazines(β)]], [TIME[2022-12-07T05:33:15.000Z]] <https://archive.md/2022.11.17-025441/https://www.hayakawabooks.com/n/n3856ec404c2f>

>
[PRE(HTML code)[
[SNIP[]]だからこの人たちの癇に<ruby style="background-repeat:no-repeat;border-bottom-color:rgb(8, 19, 26);border-bottom-style:solid;border-bottom-width:0px;border-image-outset:0;border-image-repeat:stretch;border-image-slice:100%;border-image-source:none;border-image-width:1;border-left-color:rgb(8, 19, 26);border-left-style:solid;border-left-width:0px;border-right-color:rgb(8, 19, 26);border-right-style:solid;border-right-width:0px;border-top-color:rgb(8, 19, 26);border-top-style:solid;border-top-width:0px;box-sizing:border-box;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;text-indent:0px;" >障<rt style="background-repeat:no-repeat;color:rgba(8, 19, 26, 0.66);font-size:9px;border-bottom-color:rgba(8, 19, 26, 0.66);border-bottom-style:solid;border-bottom-width:0px;border-image-outset:0;border-image-repeat:stretch;border-image-slice:100%;border-image-source:none;border-image-width:1;border-left-color:rgba(8, 19, 26, 0.66);border-left-style:solid;border-left-width:0px;border-right-color:rgba(8, 19, 26, 0.66);border-right-style:solid;border-right-width:0px;border-top-color:rgba(8, 19, 26, 0.66);border-top-style:solid;border-top-width:0px;box-sizing:border-box;display:block;line-height:normal;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;text-align:start;text-indent:0px;-webkit-text-emphasis-color:rgba(8, 19, 26, 0.66);-webkit-text-emphasis-style:none;" >さわ</rt></ruby>った(「トリガーした」)言説は、それだけで有罪確定だ。[SNIP[]]
]PRE]

[12] [CODE[rt]] に [CODE[display:block]] が指定されているので、
[[Chrome]]
では正常に[[上ルビ]]として表示されるのに、
[[Firefox]]
では[[親文字列]]の右側に[[ルビ文字列]]が表示されてしまう。
[TIME[2022-12-07T05:34:59.00Z]]

* 歴史

[1] [CITE[Latest topics > CSS3 Ruby Module - outsider reflex]] ([[Piro(SHIMODA Hiroshi)]] 著, [TIME[2009-11-12 22:13:56 +09:00]] 版) <http://piro.sakura.ne.jp/latest/blosxom/mozilla/extension/rubysupport/2008-03-16_css3.htm>

[2] [CITE@en[CSS Ruby Module Level 1]]
( ([TIME[2013-09-19 16:35:47 +09:00]] 版))
<http://www.w3.org/TR/2013/WD-css3-ruby-20130919/>

[3] [CITE@en[CSS Ruby Module Level 1]]
( ([TIME[2013-09-13 23:36:00 +09:00]] 版))
<http://dev.w3.org/csswg/css-ruby/>

[4] [CITE@en[CSS Ruby Layout Module Level 1]]
( ([TIME[2014-07-31 05:53:45 +09:00]] 版))
<http://www.w3.org/TR/2014/WD-css-ruby-1-20140805/>

[5] [CITE@en['''['''css-ruby''']''' Add myself as co-editor (again)]]
([[upsuper]]著, [TIME[2017-01-13 12:34:17 +09:00]])
<https://github.com/w3c/csswg-drafts/commit/e050fd67cd871991f217a6c769fd75dabdb9c822>

[6] [CITE@en[CSS3 Ruby Module]]
( ([TIME[2011-06-30 04:21:05 +09:00]] 版))
<http://www.w3.org/TR/2011/WD-css3-ruby-20110630/>

[10] [CITE@ja[Intent to ship: CSS Ruby]], [TIME[2022-08-31T08:00:54.000Z]] <https://groups.google.com/g/mozilla.dev.platform/c/CrVBhJaHduc>

[13] [CITE@en[880802 - Support ruby-specific display values - chromium]], [TIME[2022-12-07T05:37:54.000Z]] <https://bugs.chromium.org/p/chromium/issues/detail?id=880802>

[14] [CITE@en[44515 – Implement ruby CSS display values]], [TIME[2022-12-07T05:39:04.000Z]] <https://bugs.webkit.org/show_bug.cgi?id=44515>

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)