macのsafariとFirefoxで背景が表示されない

bodyとcontainerで背景をリピートさせています。
WindowsのIE6、IE7、Firefoxでは背景は正常に表示されるのですが、macのFirefoxとsafariでは背景がまったく表示されません。
どうしたら表示されるか、どなたかお教えいただけませんでしょうか。

body {
margin: 0;
background-image:url(bg.gif);
background-position:top;
background-repeat:repeat-x;
text-align:center;
}

#container {
width:776px;
margin:0px auto;
background-image:url(main.gif);
background-repeat:repeat-y;
text-align:left;
}

No.1 ベストアンサー 回答者： vaidurya 回答日時： 2008/09/17 21:14

この質問文で結論は出せないのですが…

インターネットに対応したパソコンのOSで言えば
Windowsは少数派の、大文字と小文字の区別を行なわないOSです。
(厳密にはOSで同一視するルールにIE等の実装が合わせてあるのだとは思う)
肝心の画像ファイルのファイル名がmain.GIFになっていたりすると
Windows等でしか表示されない現象はおきるはずです。
(拡張子を表示しないのが当たり前という奇怪なGUIがトラブルを助長することもあります)

トラブルの原因を特定するためには、実際のそのWebsiteを
他者に見てもらう方が確実かもしれません。

この回答への補足

big.gifとmain.gifはCSSでは小文字ですが、ファイルの中では大文字になっていました！
会社にしかファイルがなく小文字のはずだと思い込んでいて、昨夜自宅でお礼の書き込みをしたのですが、今日出社して確認しましたら大文字に変わってしまっていました。
そして大文字→小文字に書き換えると、macでも背景は表示されました！
ありがとうございました！助かりました m(__)m

補足日時：2008/09/18 13:09

この回答へのお礼

書き込みありがとうございます。
Windowsは大文字と小文字の区別をせず、macは区別するというのはまったくおっしゃるとおりです。
仕事の関係上Windowsやmacを交互に使ってHPを作成しており、ファイル名はもともと小文字で保存していたのに行き来しているうちに大文字に変わってしまっていて（ファイル名も拡張子も）、macで認識しないなど経験しました。
今回のCSSは小文字になっており、同じように読み込んでWindowsでは正常でmacではリピートされないのです。
周りにこういうことに詳しい知り合いがおらず、質問させていただきました。

お礼日時：2008/09/17 21:29

No.3 回答者： readordie 回答日時： 2008/09/18 13:03

background-image:url("bg.gif");

のようにダブルクォーテーションで囲んでみてはどうでしょうか

この回答へのお礼

書き込みありがとうございます。
フォルダの中のファイルを大文字から小文字に直すことで解決しました。
CSSをダブルクォーテーションで囲んでも正常に表示されていました。

お礼日時：2008/09/18 13:22

No.2 回答者： abril 回答日時： 2008/09/18 01:52

ご提供のCSSのソースを適当なHTMLから参照し、ダミーのGIF画像を作成して検証してみましたが、とりあえず私のSafari3.0.4 on Mac OSX(10.5.2)では問題なく表示される様ですが…？

「まったく表示され」ない、という事から想像されるのは、
・画像形式がMacで表示できないもの
・CSSまわりに不具合がある
という事ぐらいですが、単なるGIFファイルという事ですから前者はちょっと有り得ないですよね。ちなみに、問題の2つのGIFファイルのパスへダイレクトにアクセスした場合は、Mac上でも正しく表示されておりますでしょうか？もしそうであれば前者の可能性は完全に否定されます。

となると、CSSの指定の何らかがよろしくないのか、という様にも思えますが、提供されたソースだけを見る限りは別に間違いは見あたりませんし（だからこそこちらのSafariでは表示されているわけで）…
後者と仮定した場合の犯人捜しの一手段ですが、現在のHTMLからbody内を#containerだけにして残りを全部一時的に削除して、さらに#containerの中にはダミーのテキストだけを適量入れただけの状態にした上で、再度表示させて見るとどうなりますでしょうか？
もしそれで2箇所の背景が表示される様になったら、削除した部分のマークアップ及びそれに適用されているCSSの指定のどこかに適切ではない箇所があるのだと想定できますので、あとは#containerの中味を少しづつ復帰させながら不具合の出る箇所を突き止めます。地道な方法ですが確実ではあります。
もし結果が変わらない様でしたらちょっとこの場では想定が困難ですね。

この回答へのお礼

お忙しいところ検証いただきありがとうございます。
No.1の方へ書きましたように、もともと小文字で保存していたgifファイルが、フォルダの中では大文字に変わってしまっており、小文字に書き直すと正常に表示されました！
自宅にmaがないので、おっしゃるとおりにやってみようと出社したのですが、無事解決いたしました。
いつもご丁寧な書き込み、本当に感謝しています。

お礼日時：2008/09/18 13:21