ie vertical-align：super/sub incorrect

Question

スパン要素にスーパー/サブ垂直アライメントCSS属性を適用したいと思います。これを実行すると、スパン内の単語が正しい位置にレンダリングされます。しかし、これらの単語を含むスパンは、IEの下の誤った位置（ベースライン位置）に配置されているように見えます。それは、IEを除いて他のブラウザの下でうまく動作します。

スパム要素にcontenteditable = "true"という属性を割り当てた場合、その位置は正しい（...）になります。

君たちはここでそれを確認することができます（属性とのcontentEditable = "true" のトップの位置は0であるとwhithoutは= "true" のトップの位置があるのcontentEditable属性7）：あなたがのcon​​tentEditable削除しようとすることができhttp://jsfiddle.net/E5Af9/

=」最初の青色のスパンで「true」を選択して、何が起こるかを確認します。上記のように動作します。

スパン要素に不確実な属性を追加する以外のより安全なオプションが必要です。 誰もそれについて考えていますか？それとも、私がスパムでcontenteditableを使用する際に副作用があるかどうかは誰にでも分かります。

Answer 1

IE 7モードであってもIE 9では問題が表示されません。スパン内の単語が正しくレンダリングされているとは言いますが、スパンはそうではありません。その意味を理解できません。

とにかく、vertical-alignにはブラウザにいくつかの癖があり、仕様によっては行の高さに影響することがありますが、これはしばしば望ましくありません。したがって、相対位置決めを使用するほうがよい場合があります。たとえば、代わりに

vertical-align: 1ex; 

のあなたは

position: relative; bottom: 1ex; 

を設定することができます彼らは値superとsubをキーワード実装依存の意味を持っており、彼らはしばしば、ブラウザ間で変化させることに加えて、活字は不適当です。垂直配置は一般的に周囲の文字とフォントに依存する必要があるので、通常は上書きまたは下付きの考えをブラウザに伝える代わりに、emユニットまたはexユニットを使用して自分で設計する方がよいでしょう。