以下のコードで試して見ました。
フォントの問題（IE のみ SUPERSCRIPT FOUR (U+2074) は特別？）なのですが、Meiryo など普通のテキストでは等間隔になるフォントを探しても、input や textarea に配置すると、IE7-9 の場合 4 のみ別のフォントになってしまいます。（IE10 は持っていないので未検証）
1, 2, 3 とそれ以外では属するカテゴリーが違うので（1, 2, 3 は「ラテン 1 補助」、他は「上付き/下付きの文字」・・・IME パッド - 文字一覧で見ると分かります）、フォントが違うのはやむを得ないと思いますが、何故か 4 は ie では特別扱いされているようで他とは違います。
そうなる理由を調べてみましたが探しきれませんでした。という訳で自分には解決策は分かりません。どなたか調べていただけるとうれしいです。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Unicode Superscripts</title>
<style type="text/css">
.style1 { font-family: 'Segoe UI Semibold'; width: 200px; }
.style2 { font-family: Meiryo; width: 200px; }
.style3 { font-family: 'ＭＳ ゴシック'; width: 200px; }
</style>
</head>
<body>
<h2>Unicode Superscripts</h2>
<p style="font-family: Arial">Arial: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: 'Segoe UI Semibold'">Segoe UI Semibold: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: 'Lucida Grande'">Lucida Grande: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: Verdana">Verdana: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: sans-serif">sans-serif: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: Georgia">Georgia: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: Meiryo">Meiryo: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: 'ＭＳ ゴシック'">ＭＳ ゴシック: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: 'ＭＳ Ｐゴシック'">ＭＳ Ｐゴシック: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<p style="font-family: 'MS UI Gothic'">MS UI Gothic: X⁰¹²³⁴⁵⁶⁷⁸⁹</p>
<input type="text" class="style1" value="Segoe UI Semibold X⁰¹²³⁴⁵⁶⁷⁸⁹" />
<br />
<input type="text" class="style2" value="Meiryo X⁰¹²³⁴⁵⁶⁷⁸⁹" />
<br />
<input type="text" class="style3" value="ＭＳ ゴシック X⁰¹²³⁴⁵⁶⁷⁸⁹" />
<br />
<textarea class="style2" cols="50" rows="5">Meiryo X⁰¹²³⁴⁵⁶⁷⁸⁹</textarea><br />
<p><sup> を使用: X<sup>1234567890</sup></p>
</body>
</html>
