三点リーダがブラウザで下に表示される時のcss解決方法

三点リーダとは、いわゆる中黒「・」が３つ並んで１文字分になっている記号のこと。
ウェブサイトを作成していて、テキストで見た時はきちんと文字の上下中央に表
示されているが、HTMLコーディングしてブラウザで表示すると、何故か文字の下
側にピリオドが並んだよう（「…」こんな感じ）に表示されてしまう。

その原因はフォントの指定にある。

例えば

body {
font-family: Verdana,'ＭＳ Ｐゴシック','メイリオ',sans-serif;
}

の指定では三点リーダは中央に表示されない。

解決方法は、三点リーダに対してスタイルシートを適用すること。
最小限度は該当する欧文書体を指定してやるだけで良いが、古いIEにも対応させ
るには、以下の指定がおススメ。

HTML

<span class="santen">…</span>

.santen {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリ
オ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}