IE8でhタグの行間が詰まることについて

質問

現在HPを制作しています。

IE8でHPを表示し、文字を拡大すると、
「あるPCでは文字が大きくなり改行して表示されます。そして、改行したときに行間が詰まって表示されます」
「あるPCでは拡大されずにそのままの大きさで表示されます」

どちらもIE8（バージョンは同じ）です、OSは確認しておりません。

私的にはPCに搭載しているフォントが原因かと考えていますが、web初心者のためとても苦戦しています。
まだアップしていないのでサイトを載せることができないのですが、同じ様な現象を知っている方いらっしゃれば、解決方法を教えていただけたら幸いです。
分かりづらい文章があれば補足させていただきます。
よろしくお願いいたします。

fontのcssは
*{
color: #333333;
font-size: 12px;
line-height: 18px;
text-decoration: none;
margin: 0;
padding: 0;
word-wrap:break-word;
}

font-familyは
"メイリオ",Meiryo,"MS Pゴシック", Osaka,sans-serif;

hタグのcssは
h2 {
color: #8fc42a;
font-size: 15px;
font-weight:bold;
margin:11px 0 8px 0;
}
になります。
よろしくお願いします。

回答No.1

yui56544 · ベストアンサー

ピクセルで指定している場合、そのような現象がでる原因としては利用環境のブラウザの設定があげられます
ＭＡＣ環境でののエクスプローラ－・Windowsのエクスプローラのユーザー補助が設定されている場合、
ＨＰ製作者の意図で文字サイズを意図的に固定させることはできません。
詳しくはコチラのベストアンサーをご確認下さい
http://questionbox.jp.msn.com/qa896446.html

行間がつまってしまう不具合を解消するなら、h2のCSSに別途line-heightをemで指定すれば解消されると思われます
h2 {
color: #8fc42a;
font-size: 15px;
font-weight:bold;
margin:11px 0 8px 0;
line-height: 1.8em; ←こんな具合　指定されたフォントサイズに対して1.8文字分の行間　数値は調整してください
}

お礼

回答ありがとうございます。
ずばりこのことでした。
しかも、対応策まで教えていただけるなんて。
本当にありがとうございます。
基本的なことなど分からないことが多いのでこれからもっと勉強をしなければなりませんね。
回答ありがとうございました。

回答No.2

ORUKA1951

全称セレクタ（Universal selector）での指定は止めたほうが良いです。どこかのオーサリングツール由来ですが、ウェブの基本はユーザー優先です。*を使うと、すべてのセレクタについていちいち設定しなければならない。可能な限りユーザー側に任せること。
せいぜい
body{color: #333333;font-size: 12px;font-family:・・・}
でやめておく。これらは基本継承される。
　特にmarginは*で指定しないほうがよい。dl,block,p,・・などすべて設定しなおさなきゃならない。オーサリングの手抜き・・たまったもんじゃない。

それでもユーザーはデフォルトのフォントサイズを決めていることもあるので期待しないこと。
追記するfont-sizeは、%のほうが良いでしょう。pxだと解像度によって変化する。私はemやexが多いですが・・

h1{font-size:150%;}
h2{font-size:130%;}
h3{font-size:120%;}
h1,h2,h3,h4{margin:11px 0 8px 0;line-height:2ex;}
とか・・

お礼

回答ありがとうございます。
独学なので基本的なことが分かっていないことが多く、とても参考になりました。
後で、検索して深く勉強したいと思います。
回答ありがとうございました。