utf-8 IEで文字が大きくなる

質問

WEB制作初心者です。

utf-8を使用した場合、firefoxでは問題ないのですが、IE6だと文字サイズが大きくなっているところがあり、表示が崩れてしまいます。

もともとshift_jisを利用していたのですが、サイトにAjaxでgooglemapを表示させようとしたときに、IE6では表示できなかったので、utf-8に代えたら表示できました。
しかし上記の通り、ほかの部分のフォント表示が大きくなってしまいました。
文字コードについて理解が浅いのですが、回避策がありましたらご回答よろしくお願いします。

回答No.2

MAN_MA_RUI · ベストアンサー

IEでは文字コードがUnicode(UTF-8)のとき半角英数字のフォントが変わります。仕様。

CSSファイルに以下の記述を行って読み込ませればOKです。

body,input,button {
line-height:normal;
font-family:"ＭＳ Ｐゴシック";
}

textarea {
line-height:normal;
font-family:"ＭＳ ゴシック";
}

私の場合はIE以外が読み込まないようにHTMLファイルの側でこういう書き方をして読み込ませますけどね。
<!--[if IE]><link rel="stylesheet" type="text/css" src="ie_font.css"><![endif]-->
ie_font.cssっていうのはCSSファイルの名前ですが、別にファイル名は何でも構いません。
ちゃんと作ったファイルの名前を正しく指定していればそれでOKです。

お礼

ご回答ありがとうございます。
他のブラウザのことも考えなきゃいけませんよね。
とても勉強になります。

回答No.1

shogo0809

文字サイズではなく、半角英数(記号)が別のフォントになっているのでは？
そういった現象であればIE6の仕様ですが……。

その場合は、スタイルシートであらかじめフォントの指定をしておけば
文字コードに関係なく指定のフォントが使用されるようになります。

ウチの場合はUTF-8を用いる場合に下記の様にスタイルシートに書き加えています。
* { font-family: 'ＭＳ Ｐゴシック',Osaka,sans-serif; }

参考になれば。

お礼

ご回答ありがとうございます。
ご回答いただいたとおりに書き加えたらできました。

ちなみにこんな感じで横並びのリストにしている部分です↓

東京｜神奈川｜埼玉｜千葉｜茨城

この｜が問題なのかなと思ったんですが、やはり文字自体が1サイズ大きくなっているようです。

とりあえず解決したので、ありがとうございます。