HTML RUBYタグ行ズレ問題、（ほぼ）解決

　実は長らく、HTMLのルビは、行ズレしても仕方ないものと諦めておりました。RUBYタグのある行だけ、行間が広がってしまうのです。
↓見本（ルビ対応ブラウザで見てください）

　領主の命令により、暦学者たちは、毎年日没の時刻を割り出した。鐘はその刻に半時先んじて鳴らされる。だが、何かの都合で引き上げに手間取る者は出るものだし、天気の具合で日没より早めに夕闇が降りることもある。──陽光を嫌う妖魔(ヴァン)が、飛び始める程度の闇が。

　PIXIVというサイトが最近、ルビが使えるようになったようで。しかもほとんど行ズレがない。
　いったいどういう工夫が、と、CSS見てみたけど、もの珍しい設定は見あたらず。
　何年ぶりかで、この問題をぐぐってみたところ。2014年に良記事が。
http://hail2u.net/blog/webdesign/ruby-and-leading.html
＞アバウトにline-height: 2

　なんですとΣ(゜Д゜lll)、そんな単純なことで、解決する？！

line-height:2em 　領主の命令により、暦学者たちは、毎年日没の時刻を割り出した。鐘はその刻に半時先んじて鳴らされる。だが、何かの都合で引き上げに手間取る者は出るものだし、天気の具合で日没より早めに夕闇が降りることもある。──陽光を嫌う妖魔(ヴァン)が、飛び始める程度の闇が。

　あらやだ。ほんとだ。(ちなみに、最初の見本はline-height:1.4em)

　というわけで。「異血の子ら」掲載済み分15ファイル、CSS全部直しました^^;　

追記：
　Firefoxが、ルビ対応していると、ある方のTwitterから知りました。
　検索したところ、今年の５月ごろかららしい。
　フォント指定メイリオ、本文line-height:2emで、上記のように、IEとGoogleChromeでは行間ズレがなくなるのに、Firefoxではズレました。

body {
line-height:2em;
font-family:メイリオ,sans-serif;
}
rt{
font-family:'ＭＳ ゴシック',sans-serif;
}

……という組み合わせで、ほぼズレ解消。