• 締切済み

ファイヤーフォックスでCSSが読み込まれません

naokitaの回答

  • naokita
  • ベストアンサー率57% (1008/1745)
回答No.4

#1.2.3です。 普通なら、テキストでの396行目がエラーって事です。そんなにあるの? もしかしたら1行程度ずれているかも。 この場合、br になると思いますが、なんですかね?このCSSの br って? ソフトの改行コードでしょうか? 保存形式( CR+LF、CR、LF の3種ありますよね)、その保存形式とか。 それと文字コードの保存形式、@charsetの適応。これらを全部統一。 これらは、ソフトの保存時のソフト側の問題やパソコンでの保存やFTPやサーバ保存形式の問題。 その br も気になりますが、/* */ のコメントアウトとその中身。 記号なのか文字参照なのか/* */も含めて全部消してみたらどうなりますか? それで、CSSを1項目毎に改行してチェックするとエラー行が表示されるかも。 こんな感じで1項目毎に改行するとエラーがわかりやすい。 hr { width: 554px; color: #cccccc; height: 1px; } h1 { font-size: 12px; font-weight: normal; margin: 0 0 0; } h3 { font-size: 12px; font-weight: normal; margin: 0 0 0; } #2回答の後者の結果がわからないけど、 #2回答のように<head></head>にCSSを書いたら表示されるでしょ? それもやってみる。もちろんCSSチェックも。 <style type="text/css"><!-- ここにstylesheet.cssの中身を入れてみる。 --></style> いつも同じ方法で設定しているけど、CSSが適応されないのは、タイプミスくらいしかない・・・ これでダメならわからないよ。。。 あとは、別のCSSを書いてみて適応されるかどうかを試す。 テスト環境で簡単な別サイトでも作ってみたら?

trextrex
質問者

お礼

本当に、ありがとうございます。 ご指摘の内容を全て確認してみます。 確認後に再度、コメントさせてください。 よろしくお願いいたします。

関連するQ&A

  • ファイヤーフォックスでCSSが機能しません

    会社のホームページを担当していて困っています。 IEでは、きちんと表示されるのですが ファイヤーフォックスですとCSSを認識してくれないようです。 下記が自分会社のソースです。 何が悪いのでしょうか? よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang="ja"> <head> <title></title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/JavaScript"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <SCRIPT language=javascript src="js/libs.js" type=text/javascript></SCRIPT> <meta name="ROBOTS" content="ALL"> <<link href="css/stylesheet.css" rel="stylesheet" type="text/css" media="all"> </head>

  • 外部ファイルJS参照を全て消さないと「文字が正しくありません」エラー

    実に不思議なのですが、 以下のように4つのJSファイルをインクルードしているHTMLファイルを ローカルで開くと「文字が正しくありません」とスクリプトエラーが何回かでます。 ですが、script1~4.js の行を全てコメントアウトすると、エラーはでません。 1~4のどれかにエラーが含まれているのかと、一つ一つを外してみましたが、 どの行を外しても、やはり「文字が正しくありません」と出てしまいます。 ローカルの然るべきパスに1~4はあります。また、HTML同様、JSもEUCになってます。 何が原因なのでしょうか? <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <title>タイトル</title> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-style-type" content="text/css"> <link href="../css/style.css" rel="stylesheet"> <script src="../js/script1.js" type="text/javascript"></script> <script src="../js/script2.js" type="text/javascript"></script> <script src="../js/script3.js" type="text/javascript"></script> <script src="../js/script4.js" type="text/javascript"></script> </head>

  • HTMLメールの外部CSSが有効になりません

    HTMLメールから以下のように外部CSS(http://から始めてます)を利用したいのですが、実際にOUTLOOK 2003 SP3で見るとスタイルが適用されていません。 ローカルで同じHTMLをブラウザで開くとスタイルは適用されます。HTMLメールのときは何か特別なことが必要なのでしょうか? <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> ヘッダ全体を以下に掲載しておきます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head> <title>TITLE</title> <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head>

  • IEでCSSの中央寄せが効かない

    common.cssという外部CSSファイルで .main{ width:800px; margin:0 auto; } としています。 HTMLを簡単に書くと <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" > <title>test</title> <meta content="text/javascript" http-equiv="Content-Script-Type"> <link media="all" type="text/css" rel="stylesheet" href="css/common.css"> </head> <body> <div class="main"> ここに中央寄せになった記述 </div> </body> </html> としています。 firefoxでは中央寄せになりますが、IE8では中央によりません。 どのようにしたら良いでしょうか?

    • ベストアンサー
    • HTML
  • IEだけjsファイルを読み込まない指定

    よろしくお願いいたします。 IEだけに適用させたくないjsファイルがあり、 HTMLファイルの<head></head>内に、下記のように記述してみたのですが、 <!--[if !IE]> <script type="text/javascript" src="aaa.js"></script> <![endif]--> IEだけでなく他のすべてのブラウザで適用されなくなってしまいました。 書き方が間違っているのでしょうか・・? ソースは下記のようになっています。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta name="Description" content="あああ" /> <meta name="Keywords" content="あああ" /> <title>タイトル</title> <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" /> <link href="import.css" rel="stylesheet" type="text/css" media="all" /> <link rel="stylesheet" href="print.css" type="text/css" media="print" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <!--[if !IE]> <script type="text/javascript" src="aaa.js"></script> <![endif]--> 以下略 また、こちらのページを参考に記述いたしました。 http://blog.playunderworld.com/web/ie-conditional-comment/ もし原因をご存知でしたらお教えいただけたらと思います。 どうぞよろしくお願いいたします。

  • ModalBoxのIEでの表示について

    質問です。 javascriptの「ModalBox」についてなのですがModalBox内で指定したhtmlファイルがIE7では表示されません。Firefoxでは表示されるのですが・・・なぜでしょう? 一応javascriptは表示され上からウィンドウは表示されるのですが中身の内容がでてきません(Firefoxなら表示されます) ソースですが 表示するボタンがある側↓----------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>ModalBox サンプル</title> <meta http-equiv="Content-Style-Type" content="text/css" /> <link rel="stylesheet" href="modalbox.css" type="text/css" media="all"> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="lib/prototype.js"></script> <script type="text/javascript" src="lib/scriptaculous.js"></script> <script type="text/javascript" src="modalbox.js"></script> </head> <body> <h1>ModalBoxサンプル</h1> <a href="sample.html" title="Sample 1" onclick="Modalbox.show(this.href, this.title); return false;">ダイアログを表示</a> </body> </html> --------------------------- 表示されるhtml側↓ <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Sample</title> </head> <body> サンプル </body> </html> ----------------------------- となっています。 調べたところIE7にも対応しているとの事なのですが何故でしょうか?

  • HPの文字の大きさを変えるCSSがうまくいきません

    ネット上によく出ているjsやcssを利用した文字サイズを変える方法を、ソースを取り込んでみるのですががうまくできません。 初心者なので、かわかり易く教えていただると助かります。 尚、styleswitcher.jsはダウンロード済です。 ソースは、 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="style1.css" title="style1"> <link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2"> <link rel="alternate stylesheet" type="text/css" href="style3.css" title="style3"> <script type="text/javascript" src="styleswitcher.js"></script> <style type="text/css"> style1.css body {font-size: 100%;} style2.css body {font-size: 80%;} style3.css body {font-size: 120%;} </style> <title></title> </head> <body> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style2'); return false;">サイズ小</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style1'); return false;">サイズ中</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style3'); return false;">サイズ大</a> <br> <br> テスト<br> </body> </html> よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • JSの記述を別ファイルに移す

    下記のHTML内の <script type="text/javascript">~</script> をtest.jsとして別ファイルに移す場合にどのように、記述するればよいのでしょうか。単純にコピペしたのですがうまくいきません。 初歩的だとは思いますが、ご指導をお願いします。 --------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/Draggable.js"></script> </head> <body> <div id="test1" class="test"></div> <div id="test2" class="test"></div> <script type="text/javascript"> var test1 = new Draggable("test1"); var test2 = new Draggable("test2"); </script> </body> </html>

  • ジャバスクリプトが作動しません。

    初めまして、素人なので的外れな質問だったら恐縮です。 以下のようにジャバスクリプトを2つ記述しましたが、後ろに記述した1つしか作動しません。 記述の順番を入れ替えても、やはり後ろに記述した方しか作動しません。 何が悪いのか、どなたか教えて頂けますでしょうか? <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>ホームページテンプレート</title> <meta name="description" content="説明を入れます" /> <meta name="keywords" content="キーワード" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/script.js"></script> <link href="css/gallery11.css" rel="stylesheet" type="text/css" media="screen" /> <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/effects.js"></script> <script type="text/javascript" src="js/glider.js"></script> <script type="text/javascript"><!-- Event.observe(window, "load", function(){ new Glider("album1", { duration:1.0 } ); }); // --></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ var setImg = '#viewer'; var fadeSpeed = 1500; var switchDelay = 5000; $(setImg).children('img').css({opacity:'0'}); $(setImg + ' img:first').stop().animate({opacity:'1',zIndex:'20'},fadeSpeed); setInterval(function(){ $(setImg + ' :first-child').animate({opacity:'0'},fadeSpeed).next('img').animate({opacity:'1'},fadeSpeed).end().appendTo(setImg); },switchDelay); }); </script> </head>

  • ホームページのヘッダ部分について

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML LANG="JA"> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=Shift_JIS"> <META HTTP-EQUIV="CONTENT-STYLE-TYPE" CONTENT="text/css"> <META HTTP-EQUIV="CONTENT-SCRIPT-TYPE" CONTENT="text/javascript"> <TITLE>○○○○</TITLE> <LINK REL="STYLESHEET" TYPE="text/css" HREF="css1.css"> <meta name="keywords" content="△,△,△,△,,△,△,"> <meta name="description" content="●●●●●"> </HEAD> <BODY> … となっているのですが、無駄な部分はありますか? 順番などは合ってますか? また、こうしたほうがいい、などとアドバイスがあればぜひよろしくお願いいたします。