11px以下のフォントが指定より大きくなる

まず，font-size のページを IE6 または IE7 でご覧ください。

順にフォントサイズが小さくなっていくはずなのですが，74%から72%あたりの日本語のフォントサイズが一旦大きくなっています。その後71%から 60%のところまで，日本語フォントはサイズが変わっていません。

FIrefox の場合と比べると，よく分かるかもしれません。

%で指定された font-size は，最終的にpxに変換され，端数処理して整数値になったものが表示されます。IEの場合，11.5px以上12px未満になるところは，本来12pxで表示されるはずですが，13pxになっています。9.5px以上11.5px未満のところは，すべて12pxで表示されています。

emで指定した場合も同様の結果になりました。

フォントサイズを11px以下にすることの是非も少々気になりますが...。

解決法1：UTF-8にしない

まず，文字コードをUTF-8以外の日本語コード，Shift_JISやEUC-JPにすることで解決します。

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />

しかし，XHTMLでXML宣言を省略する場合（文字コードがUTF-8なら省略可）もあるし，最近はUTF-8が主流になりつつある状況を考えると，あまり好ましい方法とは言えません。

解決法2：日本語フォントを指定する

font-family で最初に日本語フォントを指定することでも解決します。（英字フォントの後に日本語フォントを指定した場合は解決しないようです）

個人的には，特別な事情がない限り，font-family に特定のフォントを指定するのは「余計なお世話」という感じもします。11px以下になるところにだけ，次のように指定するのがよいかもしれません。

div#footer ul.nav {
  font-size: 71%;
}

* html div#footer ul.nav {
  font-family: 'ＭＳ Ｐゴシック', sans-serif;
}

*:first-child+html div#footer ul.nav {
  font-family: 'メイリオ', sans-serif;
}

12pxで表示したいときは，pxに変換したとき12px以上12.5px未満になる値を指定しておけば大丈夫です。

参考

font-size指定については，以下も参考にしてください。

• font-size指定