最近、世間様の流れに乗っかったか逆らったかで、通常使用のブラウザをFirefoxに変えました。
なかなか好調だったんですが、Webサイトのレイアウトを、
Firefox寄りにちょこーっと修正したら、IEの表示が狂ってしまいました。

おおこれが噂のブラウザ誤差・・・としばらく感動（いやおかしいか）しつつも、
どうにも見逃せる誤差ではなかったため、無い知識フル稼働で何とかして直すことに。
とは言え、元々IE表示で上手く見れるように作っていただけに、
（逆ならともかく）本来なら狂うはずが無いんですよねぇ。
やっぱりフォント設定をいじったのがダメだったのかなぁ・・・。
ああ、その辺はド素人。どこをどう修正したら狂ったのか、てんで分かりません。

水平線、というか枠線なんですけれど。
テキストの真ん中くらいに使う区切り線を、下枠だけ1px表示して使っていたんです。
（この日記の目次とタイトルの間にある感じのヤツですね。hr使えば早い、なんて言ったら元も子も無い（笑））

枠線の余白指定がどうにも上手くいかない。IEだと、何故か余計に上部の余白だけ大きいのです。
この区切り線スタイルをサイト内で多用していたため、今更イチから書き直すのは面倒すぎる、
ということで、無謀にもCSSだけ修正して何とかすることに。
・・・いやできるだろう、きっと!!　そのためのCSSだし（大見栄）

ちなみに「width」で幅を指定しなければキレイに表示されました。理由は知らん（阿呆）
いやでも枠線・・・そんなに長くなくても良い・・・（ズボラなくせに妙なこだわり）

素人ながらに色々と足したり引いたりしながら試した結果、
IEだと、枠線（を指定した透明なboxの中）に、
全体でフォント指定を掛けたサイズの、透明な文字が入っているような状態だと判明。
確かに、全体指定用のフォントサイズを変更すると、枠線の上余白も大きくなっています。
たぶん親boxの指定が子boxにも引き継がれるとか何とか、そんな感じなんじゃないかと。

え?　解決策ですか?
とりあえず、無理やり枠線用のフォントサイズをゼロパーセントに指定してみました。
（単なる区切り線なので、実際1文字も使わないのにも関わらず。つまり意味のない指定。）
記述上、枠線の上に透明な文字はあるけれど、小さすぎて誤差も見えない、そんな状態。
誤魔化しどころか、ド直球です。

どう考えても、もっとスマートなやり方が絶対にあります（笑）