IE7でスタイルシートの表示がうまくいかなくなった

このQ&Aのポイント
  • IE7でのスタイルシート表示に問題が発生
  • IE6までの時とは異なる表示結果が生じてしまう
  • IE7でIE6環境と同じ表示をするための方法
回答を見る
  • ベストアンサー

IE7でスタイルシートの表示がうまくいかなくなった

これまで使っていたスタイルシートがIE7ではIE6までの時のように表示されなくなりました。 IE7環境でもIE6環境と同じように表示させるには、スタイルシートをどのように直したらよいでしょう。 ■スタイルシートのソース <style type="text/css"> p {font-size=12pt;Letter-spacing:0.3pt;line-height:15pt;} a:link {color:blue;text-decoration:none;} a:active {color:blue;text-decoration:none;} a:visited {color:lightseagreen;text-decoration:none;} a:hover{text-decoration:none;background:brown;color:white} <!-- body{ scrollbar-shadow-color:blue; scrollbar-face-color:antiquewhite; scrollbar-Highlight-Color:cornflowerblue; scrollbar-arrow-color:dodgerblue; } --> div.blocka { float: left; width: 69%; } div.blockc { clear: both; } </style> ■想定している表示(IE6で実現できている表示) <div class="blocka"> 以下を左側に69%幅で表示 </div> <div class="blockb"> 以下を右側に表示 </div> <div class="blockc"> 以下をa|bの下に表示 </div>  a(69%)| b  -----------      c

  • CSS
  • 回答数1
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
noname#19175
noname#19175
回答No.1

IE7がないので(今はまだインストールする気もありませんが)検証できませんが、 <!-- と --> の位置を直してみてはいかがでしょうか?

moto039
質問者

お礼

ありがとうございます。<!-- -->を削除したら直りました。IE6では上記ソースで表示できていたので、IE7ではコメントタグの扱いが変わったのかも知れません・・

関連するQ&A

  • 外部スタイルシートについて・・・

    外部スタイルシートを書きたいのですが、 まだ良くわかってない点があるので教えてくださると嬉しいんですが・・・(TT) 今はHTMLのヘッダ内に書いております。 <style TYPE="text/css"> </style> Q1,上の部分は外部スタイルシートにすると、いらないのでしょうか? Q2,下の部分は外部スタイルシートにしてもスタイルシート内に、書く事ができますか?書くと不具合の原因になるのでしょうか? <!-- //忘れてしまうので、ここにコメント書きたいです。 できれば、スタイルシートを表示できない?ブラウザの人へ配慮したいと思うので、 <!-- は、あった方が自分が忘れなくていいかと思うのですが・・・。 Q3,ブラウザによって変になる、例えばとっても古いバージョンのネスケなどでも表示できるといいのですが 下記で問題あるのでしょうか? もし良かったら下の内容をこうした方がいいという アドバイスがあると嬉しいです。 質問の仕方が良くないかもしれませんが教えて下さい(TT) <style TYPE="text/css"> <!-- //忘れてしまうので、ここにコメント書きたいです。 a:link {font-size: 11pt; text-decoration:none; color:#C7A17E;} a:visited {font-size: 11pt; text-decoration:none; color:#C7A17E;} a:active {font-size: 11pt; text-decoration:none; color:#C7A17E;} a:hover {font-size: 11pt; text-decoration:underline; color:#FF9966;} td {font-size: 11pt;} span {font-size: 11pt;} BODY {font-size: 11pt; } LI {font-size: 11pt;} --> </style>

    • ベストアンサー
    • HTML
  • スタイルシートのリンクについて

    スタイルシートを下記の様に記述しました。 そこでリンクの部分なのですが ポインタが上にのった時にff6666になるようにしているのですが、 ff9900のままなのです。 通常はffcc00 既読はff9900 ポインタ上にのった時にff6666 クリックした時にff0000としたいのです。 どなたかお教え下さい。 <style type="text/css"> <!-- BODY { SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #ffcc00; SCROLLBAR-ARROW-COLOR: #ffcc00; SCROLLBAR-BASE-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR : #ffffff; SCROLLBAR-3DLIGHT-COLOR : #ffcc00} body,tr,td {font-size: 9pt;} body,tr,td {color: #ffcc00;} a {text-decoration: none;} a:link {color: #ffcc00;} a:hover {text-decoration: underline;} a:hover {color: #ff6666;} a:active {color: #ff0000;} a:visited {color: #ff9900;} body { background-repeat: no-repeat; background-position: 100% 100%; background-attachment: fixed;} --> </style>

    • ベストアンサー
    • CSS
  • スタイルシートの記述について

    お世話になります。 スタイルシートでリンク箇所にアンダーバーを つけないために下記の記述をしているのですが a:link { Color: #0000cc; text-decoration: none; } a:visited { color: #0000cc; text-decoration: none; } a:hover { color: #ff0000; text-decoration: underline; } a:active { color: #0000cc; text-decoration: none; } ブラウザを起動してみてみるとアンダーバーが 表示されます。 一度リンクをクリックするとアンダーバーの 表示が消えます。 どこかミスがあるのでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • 外部CSSをかくには。

    HPのページひとつひとつにいちいちスタイルシートをかいていくのが 面倒になったので外部CSSでまとめてしまおうと 思ったのですが、上手くいきません。 ちなみにこうかいております↓ <STYLE TYPE="text/css"> <!-- BODY {  letter-spacing:7px;  line-height:15pt; } --> </STYLE> <style type="text/css"> <!-- body { scrollbar-face-color: #FF9900; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #000000; scrollbar-3dlight-color: #000000; scrollbar-arrow-color: #000000; scrollbar-track-color: #ff9900; scrollbar-darkshadow-color: #ffffff; } --> </STYLE> <STYLE TYPE="text/css"><!--A{text-decoration:none;}A:hover{text-decoration:underline overline;}--></STYLE> <style type=text/css><!--a{text-decoration:none;}--></style> <style><!--BODY{font-size:8pt;}--></STYLE> どこか悪い点がありましたら教えてください。

    • ベストアンサー
    • HTML
  • スタイルシート・・・この記述は正しいですか?

    メモ帳で(苦笑)HPを作っています。いままではテーブルなどのほんとに簡単なタグしか使っていなかったのですが、そろそろサイトデザインを変えたいな~と思って、スタイルシートに挑戦してみることにしました。マウスをオンにしたときリンクの背景色が変わるとか、スクロールバーの色を変えるとか、見た目は思った通りに表示できているのですが(ブラウザIE6.0/NN6.02です)、本やいろんなサイトさんのソースを参考に打ってるだけなので、本当にこれで合っているのか不安です。お時間のある方アドバイスなど頂けたらと思います。よろしくお願いします。 <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta name="robots" content="index,nofollow"> <style type="text/css"> <!-- body { background-color:#; scrollbar-face-color: #; scrollbar highlight-color: #; scrollbar-shadow-color: #; scrollbar-3dlight-color: #; scrollbar-arrow-color: #; scrollbar-track-color: #; scrollbar-darkshadow-color: # } a{text-decoration:none} a:link {color:#;background-color:#;} a:visited {color:#;background-color:#;} a:hover {color:#;background-color:#;} --> </style> </head> <body> </body> </html>

    • ベストアンサー
    • HTML
  • 次のスタイルシートにおいて

    <style type="text/css"> <!-- a:link { color:#333333;text-decoration:none; } a:visited { color:#333333;text-decoration:none; } a:active { color:#ff0000;text-decoration:none; } a:hover { color:#ff0000;text-decoration:none; } --> </style> a:linkなどがA:linkになっているものを見かけますがaを小文字で書くよりも大文字で書くほうが望ましいのでしょうか? 特にxhtml1.1の観点から教えてください

    • ベストアンサー
    • Flash
  • CSS外部呼び出し

    今ジオシティーズでスタイルシートの外部呼出しをやってみたんですが、 いくつか繁栄されないものがあるんですが、記述で間違っている所がありましたら直していただきたいのです。 A { text-decoration: none; } A:visited {text-decoration:none} A:link {text-decoration:none} A:hover {color:red; text-decoration:underline} P { font-size: 12pt; } Body,Td {line-height:15pt;} Body {scrollbar-arrow-color: #000000; scrollbar-face-color: #ffffff;scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #000000; scrollbar-track-color: #ffffff; scrollbar-shadow-color: #ffffff; scrollbar-darkshadow-color: #000000} これに更に A:link { color: blue; } A:visited { color: #8080FF; } A:hover { color: #FFFF00; } A:active { color: red; } を足したいのですが、可能でしょうか?

    • ベストアンサー
    • CSS
  • スタイルシートでオンマウスで下線を表示させないには

    以下のような外部スタイルシートを作ったのですがうまくいきません。 p.menu a{ font-size: 12px; } p.menu a:link{ text-decoration:none } p.menu a:visited{ text-decoration:none; } p.menu a:hover{ text-decoration:none; } p.menu a:active{ text-decoration:none; } noline a{ text-decoration:none; } 以下はHTMLの抜粋です。 <noline> <TR> <TD>●<a href="http://www.hogehoge.net/" style="text-decoration:none" target="_blank"><font color="black" onMouseover="this.color='#ff8800'" onMouseout="this.color='black'">ああああ</font></a></TD> </TR> </noline> 結局外部スタイルシートを使わずにWEBPAGEを作成しましたがとても手間がかかりました。今後のために原因を知っておきたいので宜しくお願いします。

    • ベストアンサー
    • CSS
  • スタイルシートのアンカー部分

    スタイルシートを利用してのアンカー部分の指定についてです。 a:link {color: yellow; text-decoration: none; } a:visited {color: yellow; text-decoration: none; } a:active {color: yellow; text-decoration: none; } a:hover {color: red; font-weight: bold; text-decoration: underline; } 現在、このように記述しています。 今までは、ページ毎に<STYLE TYPE="text/css">タグを使用し、本文中に記述していたのですが、その代わりとして新たに外部読み込みのcssファイルを使用してみました。 ところが、未訪問リンクだけが反映されないのです。 青文字で、下線付きで表示されてしまいます。 未訪問以外は、bodyなども含め、きちんと反映されています。 色々試行錯誤してみましたが、全然駄目だったので、 再び本文内に書き込む形を取りました。 IE5.5で動作確認しています。 この理由及び対策を御存知の方、教えていただけませんでしょうか?

    • ベストアンサー
    • HTML
  • fontタグとスタイルシートの相対値

    CSSでこういう使い方はありえないかもしれませんが、 1は60ptですが、2,3は何ptですか? このようにfontタグは一つ上のdivのスタイルシートに影響せずにfont sizeで完結していますが 値を相対的に変化させる(例えばdivの値の20%とか)ことはスタイルシートのしくみでありますか? <style type="text/css"> <!-- .a { font-size:60pt; } --> </style> <!-- 1 --> <div class="a">60pt</div> <!-- 2 --> <div class="a"><font size="-1">?px</font></div> <!-- 3 --> <div class="a"><font size="1">?px</font></div>

    • ベストアンサー
    • HTML

専門家に質問してみよう