ルビと親文字の空き (was Re: 両側ルビをどうするか

そうですね、transformはline-heightに影響を及ぼさないので、そうなります。

私の理解では、一般に書籍類ではルビが入る分だけの行間（line-height）を取り、ルビがあってもその行だけ行が広がることがないようにしており、マンガや端物ではデザイン上の問題から行間はツメ気味にして、ルビがある行だけ広げることが多いと思っています。アクセシビリティでのルビ利用は、マンガ・端物と同様なのですか？


On Wed, Sep 28, 2022 at 10:25 AM MURATA Makoto <eb2m-mrt@asahi-net.or.jp>
wrote:

>
>> 最後に、村田さんご指摘の親文字とルビの間を空ける機能についてですが、Chromiumのルビ関連issue
>> <https://bugs.chromium.org/p/chromium/issues/list?q=component%3ABlink%3ELayout%3ERuby&can=2>
>> で探すと、おそらくこれ
>> <https://bugs.chromium.org/p/chromium/issues/detail?id=1233420>
>> が該当するかと思います。ここではline-heightを使いたいと書いてありますが、line-heightはFirefox含めどのブラウザーでも動作しませんでした。
>>
>>
>> 現状の回避策としては、Firefoxはpaddingあるいはmarginが使えて、Chrome/Safariではtransformが使えるようです。逆にFirefoxはtransformを無視して、Chrome/Safariをpadding/marginを無視するようなので、両方指定すれば全部のブラウザーで動作するようです。
>> サンプルはこちら
>> <https://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0A%3Cstyle%3E%0Abody%20%7B%20font-size%3A%2020px%3B%20margin-top%3A%2030px%3B%20%7D%0Aruby%20%3E%20ruby%20%7B%0A%20%20ruby-position%3A%20under%3B%0A%20%20-webkit-ruby-position%3A%20after%3B%0A%7D%0Aruby%20%3E%20rt%20%7B%0A%20%20padding-bottom%3A%2010px%3B%0A%20%20transform%3A%20translate(0%2C%20-10px)%3B%0A%7D%0Aruby%20%3E%20ruby%20%3E%20rt%20%7B%0A%20%20padding-top%3A%2010px%3B%0A%20%20transform%3A%20translate(0%2C%2010px)%3B%0A%7D%0A%3C%2Fstyle%3E%0A%3Cruby%3E%0A%20%20%3Cruby%3E%0A%20%20%20%20%E4%BA%94%E7%B5%8C%0A%20%20%20%20%3Crt%3E%E3%81%94%E3%81%8D%E3%82%87%E3%81%86%3C%2Frt%3E%0A%20%20%3C%2Fruby%3E%0A%20%20%3Crt%3E%E3%81%94%E3%81%91%E3%81%84%3C%2Frt%3E%0A%3C%2Fruby%3E>
>> 。Chrome/Safariは、WebKit実装当時のW3Cでの議論に基づき、ブロック扱い（DIVやPと同様）になっていますが、Firefoxはインライン扱い（SPANと同様）になっているようです。transformはインラインには適用されないので、このような違いが生まれているのではないかと推測されます。
>>
>
> transformで動かすのを試してみましたが、前の行に思いっきり
> 重なってしまうようです。回避策はありますか？行間を最初か
> ら思いっきり空けておく？
>
> 村田 真
>