cssはいろいろ出来て楽しいものですが、ブラウザ（インターネットエクスプローラーとか）やOS（WindowsとかMac）の違いで表示に差異が出てくる、ちょっと扱いの難しいものでもあります。
この場合悪いのは主にブラウザで、現在CSSをきちんと正確に理解して表示することができないんです。
一人でも多くの人にキッチリみてもらいたいなぁ、と思ったら、ちょっとこんなことを試してみましょう。
FIrefoxにも対応しよう
Firefoxとは一部では話題の無料のブラウザです。近頃シェアがじわじわ増えてきました。
そのFirefox、基本の表示フォントは明朝体です。別に設定を変えればゴシック体になるんですが･･･変えなくて済むならそのほうがラクです。
そこでFirefoxでも、ゴシック体で表示されるように、cssでフォントを指定しましょう。
body{ /*body以外にhtmlでもOK--*/
font-family: Osaka,'ＭＳ Ｐゴシック',sans-serif;
}
フォントファミリーではフォントの正確な名前さえ記述されていれば、どんなフォントでも指定できます。
前にあるフォントほど優先され、そのフォントがなければ次のフォント、それもなければさらに次、というようになります。
人のパソコンにはどのフォントがあるかわからないので、最後に「sans-serif」といれておきます。
そうすると、ブラウザに設定されているsans-serifフォントが使われます。
これは意図的にいじらなければ、通常ゴシック体のフォントが指定されているので、Firefoxでもゴシックで表示されるようになるわけです。
MacIEに対応しよう
MacIEとは、Macintoshのインターネットエクスプローラーのことです。
同じ名前でもWindowsのそれとはまったく違う挙動を見せます。
cssの中に「Hides from IE-mac」とあるのは、このMacIEには読ませたくない（読むとおかしな表示になる）部分です。
このMacIEの大きな問題は、背景画像の指定です。
通常背景画像は
('----画像のURL----')
このように表記します。
ところが困ったことに、MacIEではこの表記では画像を読み込めなかったりします。
そこで、MacIEでも読めるようにちょっと表記を変えてあげます。
(----画像のURL----)
ちょっとの違いなのでわかりにくいと思いますが、URLを囲んでいた「’」をとっています。
これでMacIEでも背景画像を表示できるようになりました。
別に読むことはできるけど、ちょっとしたことで読みやすくなったり見せたいデザインが見せられたりすると、ちょっとうれしいかなぁ、という書き手ゴコロ･･･。