[quote="EarlgreyTea"]その計算が Chrome でテストした際の想定と合わないため重なってしまっているものと思います。[/quote]
これはちょっと外れていました。
hobbit_makoto さんご提示のWEBページでは、JavaScriptにてブラウザー判定を行い、読み込むスタイルシートを切り替えていました。
すなわち、Chrome や Edge と、Firefox では別のスタイルシートが適用されており、それがルビ部分の表示の差の直接の原因でした。

ブラウザー判定は User-Agent 文字列に含まれるキーワードで判断しており

(1) キーワード「MSIE」　…　該当：Internet Explorer 10以前
　　→ ie.css を読み込む
(2) キーワード「Firefox/3」　…　該当：Firefox 3.x.x および Firefox 30番代
(3) キーワード「Opera/9」　…　該当：Presto版旧Opera
(4) キーワード「Safari/5」　…　該当：現行のBlinkベースのブラウザー、Safariなど多数
　　→ ff3.css を読み込む
(5) キーワード「Gecko」　…　該当：(2) 以外のFirefox、および派生ブラウザー
　　→ ge.css を読み込む
(6) 上記以外　…　該当：Internet Explorer 11など
　　→ 追加読み込みしない

のようにスタイルシートを追加読み込みさせています。
このブラウザー判定は、かなり昔の状況からメンテナンスされていないように見受けられます。

このブラウザー判定を廃止して常に ff3.css の内容が適用されるように変更していただければ、
ひとまず問題は解消すると思います。

hobbit_makoto さん、EarlgreyTea と申します。

[quote="hobbit_makoto"]http://hobbit.ddo.jp/tolkien/instrume/lotr1.html
のルビを振ったところ、
IE, Edge, Google Chromeでは正しく表示されますが、Firefoxではルビが上の行や罫線に重なってしまいます。[/quote]
はい、たしかに重なってしまいますね。

[quote="hobbit_makoto"]ルビで行の高さが変わることがサポートされていないようです。[/quote]
そういうわけではなく、ルビが指定された箇所は行間が広くなっています。
しかし、ge.css にてルビ文字列に対して[code] position:absolute;
top:-1.2em;[/code]などと設定されていますが、その計算が Chrome でテストした際の想定と合わないため重なってしまっているものと思います。[attachment=1]ルビ文字列が上の行に重なっている.jpg[/attachment]
試しにウェブ開発ツールのインスペクターにて、一時的に上記スタイルを無効化すると重ならずに表示できます。[attachment=0]absolute指定を取ったらルビ文字列が重ならない.jpg[/attachment]
これとか参考にしてみてはどうでしょう。
https://romly.com/blog/css_ruby/

http://hobbit.ddo.jp/tolkien/instrume/lotr1.html

のルビを振ったところ、
IE, Edge, Google Chromeでは正しく表示されますが、Firefoxではルビが上の行や罫線に重なってしまいます。ルビで行の高さが変わることがサポートされていないようです。