- 締切済み
mozillaで背景が表示できない
mozillaでbodyの背景色Aを指定しdiv(1)に別の背景色Bをidで指定すると表示されますが そのdiv(1)の中にdiv(2)を入れidまたはclassを指定すると背景色Bが表示されなくなってしまいます。 ■色々と試してみました ie6では問題なく表示されます。 div(1)の中に複数divを入れた場合、やはり表示されませんが div(1)の閉じタグ</div>の前に (他の文字ではダメでした)を入れた場合、一部のdivに対してだけ背景が適用されました。 ＃適用されない部分のソースに間違いがあるのではとソースを入れ替えてみましたが、やはり適用されない部分は適用されないままでした。 div(2)のidまたはclassを指定しない場合は想定どおり表示されます。 上記を踏まえ、div(2)をidまたはclassを指定しないdivで囲ってみましたが、やはり適用されませんでした。 長々とわかりにくい説明で申し訳ございませんが、 どのようにしたらdiv(1)の背景を表示させられますか？ アドバイス等思いついたことでも構いません。 結構試しましたが手詰まり状態なのです(T_T よろしくお願いします。 <body> <div id="zentai"> aaa </div> </body> bodyに背景色A、zentaiに背景色B 結果：OK <body> <div id="zentai"> <div id="nakami"> aaa </div> </div> </body> bodyに背景色A、zentaiに背景色B 結果：NG bodyに背景色A、zentaiに背景色B、nakamiに背景色B 結果：nakamiのみ背景色が適用される
- tetsu-jin
- お礼率67% (52/77)
- HTML
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- key-child
- ベストアンサー率54% (25/46)
現象が再現されないため、もっと具体的なソースが必要。
関連するQ&A
- css で背景のリピート設定についておしえてください。
css で背景のリピート設定についておしえてください。 htmlもcssも初心者で初めてホームページの制作をしています。 タグをコピーします。 <body> <div id="header"> </div> <div id="globalnavi"> <ul> <li id="menu"><a href="#">メニュー</a></li> <li id="menu"><a href="#">メニュー</a></li> <li id="menu"><a href="#">メニュー</a></li> </ul> </div> </div> <div id="haikei_repeat"> <div id="content1"> <div class="inner_top"></div> <div class="inner_repeat"> ここにテキスト </div> <div class="inner_bottom"></div> </div> <div id="body_right"> <div class="inner_top2"></div> <div class="inner_repeat2">ここにもテキスト</div> <div class="inner_bottom2"></div> </div> </div> </body> bodyにも背景画像を使い、ヘッダ以下の コンテント部分の<div id=haikei_repeat> にy方向にリピート画像を指定しました。 <div id="haikei_repeat"> の中にある、 div classにもそれぞれ背景画像をしていし、topとbottomはリピートさせず、 真ん中のinner_repeatのみ背景画像をリピートしています。 このdivにテキストやimgを挿入し、後ろのhaikei_repeatもinnerrepeatの大きさに合わせて縦に リピートしてほしいのですが、うまくできません。 <div id="haikei_repeat">と <div id="inner_repeat">のボックスサイズは 横は指定し、縦のみauto にしています。 inner_repeatはきちんと内容の量にあわせてレピート表示できていますが、 背景リピートはできていません。 どのようにしたらいいでしょうか？？？ どなたかおねがいします。
- ベストアンサー
- HTML
- divの背景を高さ100%表示
以下のように、divをつかって背景色を設定した際、 右のピクセル指定の背景は、スクロールバーが出た場合でも 指定された高さまで背景色が表示されるのですが、 左の100%表示指定の方はウィンドウで隠れた部分で切れてしまいます。 色々調べたのですが、 過去にも同じような内容で質問があり、min-heightを追加する事で解決するとありました。 同じように試してみたのですが、思ったように表示がされません。 指定している場所が間違っているのでしょうか？ <style type="text/css"> html{ height:100%; } body { height:100%; } #test1 { height:auto !important; height:100%; min-height:100%; float:left; width:400px; background-color:black; } #test2{ float:right; height:800px; width:400px; background-color:black; } body > #test1 { height: auto; } </style> </head> <body> <div id="test1"></div> <div id="test2"></div> </body> </html>
- ベストアンサー
- HTML
- firefoxで見るとdiv背景画像がスクロールで消えてしまいます
http://www.geocities.jp/testac2007/ bodyに「top_bg.gif」という背景画像指定をした上で更にdivを重ね、そのdiv内に「side_860.gif」という背景画像を指定しています。 ieだと意図した通りに表示されるのですが、 FirefoxやNetscapeで確認すると、表示されているページより下部のスクロール以下の背景画像が表示されません。 何とか同症状についてネットで検索し試行錯誤してみたのですが、解決に至りませんでしたのでこちらでヘルプさせていただきました。皆さんのお知恵を拝借いただきたいです。 ■■■HTMLの概要■■■ <body> <div id="side_bg"> <div id="outline"> <div id="A01">○○○</div> <div id="A02"> <div class="A02_left">○○○</div> <div class="A02_right">○○○</div> <br class="c-both"> </div> <div id="B01">○○○</div> </div> </div> </body> ■■■CSSの概要■■■ body { margin:0px auto; background-image:url(images/top_bg.gif); } #side_bg { width:860px; height:100%; margin:0 auto; background:#ffffff url(images/side_860.gif); overflow:visible; } #outline { width:830px; margin:0 auto; background-color:#FFFFFF; } .c-both { clear:both;} #A01{ width:830px; margin:15px 0px 4px 0px; overflow: auto; } #A02{ width:830px; margin:0px 0px 4px 0px; overflow: auto; } .A02_left{ width:304px; float:left; } .A02_right{ width:526px; float:right; margin-top:4px; } #B01{ width:730px; margin:20px 50px; }
- ベストアンサー
- CSS
- cssで背景を重ねることができるのでしょうか？
CSSでナビゲーションバーを作っていますが、ナビゲーションバーのボタンの一つ一つを背景画像であらわしています。ナビゲーションバー全体の背景にまた違う画像を表示させたい（ボタンが途切れた後ろにも画像があるように）のですが、そういうことは可能なのでしょうか？ちなみにＨＴＭＬは <body> <div id="navigation"> <div> <ul> <li class="linkhome"><a href="/"><span>Home</span></a></li> <li class="linkkaisha"><a href="/"><span>kaisha</span></a></li> <li class="linkdoituriq"><a href="/"><span>doituriq</span></a></li> <li class="linkwine"><a href="/"><span>wine</span></a></li> <li class="linkchugoku"><a href="/"><span>chugoku</span></a></li> <li class="linkotoiawase"><a href="/"><span>otoiawase</span></a></li> </ul> </div> </div> </body> </html> という感じで、最初のdivにz-index2を次のdivにz-index1を指定したらできると思ったのですが、表示はナビゲーションバーの後ろに表示させたい画像がまず表示され、その下にナビゲーションバーが表示されます。 重ねて表示するのはどうすればいいのでしょうか？ 質問が分かりづらくて申し訳ございません。どうぞよろしくお願いいたします。
- ベストアンサー
- HTML
- 背景グラデーションが、firefox、GoogleChromeなどで表示されません
webページを作成しているのですが、 IEではきちんと表示される背景のグラデーションが、firefox、GoogleChromeなどでは表示がされません。 （白背景になります。その他の画像などの表示は正常です。） ソースはbody内で、下記を使用しております。 <div id="obj1" style="width:100%;height:100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#46B0E5,endColorstr=#3A6EB6)"> 原因は何でしょうか？よろしくお願い致します。
- 締切済み
- その他([技術者向] コンピューター)
- CSSでの背景色設定とIE6.0での表示について
お世話になります。 全くの初心者ですが、Golive7.0の体験版を使ってHP作りに挑戦しています。 過去ログで調べてもわからなかったので教えて下さい。 使用OS : Windows XP (1) HTMLで表示する文章を作り、CSSファイルで、divブロック（class=contents）内の背景や文字色などは設定できましたが、ページ全体のbodyに適用させる背景色は反映されません。 body { background-color: #E7FAEE; } HTMLソースの方に直接上記の設定を指定すると反映されました。 参考にしている入門書にはCSS内で記述するように書かれていますが、何か忘れていることなどがありますでしょうか？ CSSファイルのリンク設定はちゃんと反映されています。 (2) divブロック（contents）を画面の真ん中に配置するよう、 .contents { text-align: center; width: 600px; margin:auto; } と設定しましたが、IE6.0では画面の左端に寄っています。 ネットスケープ7.1ではきちんと中央に表示されます。 入門書には、『HTMLソースに<div class="contents">を入れないとIE5.xでは幅が固定されません』とあり、そこも記述してあります。 サーバーに上げてもプレビューと同じく反映されていませんでした。 5.xバージョンではないのに反映されないのはなぜでしょうか？ 以上、どうぞよろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- CSSで背景画像が表示されない
CSSレイアウトで通常のHTMLで作成しています。 背景画像が表示されないくて困っています。 他の方の質問で似た事例があったのと、 情報サイトを見てみたのですがどうしても上手くいきません。 この場合floatとclearはどう使えば背景が表示されるのでしょうか？ http://oshiete1.goo.ne.jp/qa3882745.html http://2nose.com/css/?ID=120 bodyには別背景を指定してあるのでbodyへの指定はできません。 何かアドバイスがあれば教えて頂けますでしょうか。(__) 確認はIE8です。 [ css ]----------------------------------------------------- #wrap{ width: 920px; height: 100%; margin-left: auto; margin-right: auto; background: url(../img/background.jpg) repeat-y; } #contents{ clear: both; } #sidemenu{ width: 275px; float: left; } #mainbox{ width: 570px; float:right; } [ html ]---------------------------------------------------- <div id="wrap"> <div id="contents"> <div id="sidemenu">サイドメニュー内容</div> <div id="mainbox">メインコンテンツ</div> </div> </div> 以上です、よろしくおねがいします！
- ベストアンサー
- HTML
- firefoxでセンター表示されない
制作上の質問です。 インターネットエクスプローラーではきちんと センター表示されているのですが firefoxだとセンターに表示されません 以下のようにソースを組んでいます。※単純化しています。 ＜body＞ ＜div id="header"＞＜/div＞ ＜div id="wrapper"＞＜/div＞ ＜/body＞ スタイルシートで ＜body＞に背景画像Aとbackground-position:center;を 設定しています。 背景画像Aはfirefoxでもセンターに表示されます。 センター位置にこないのは id="header"や id="wrapper"です。 中身がセンターに表示されず、画面の左寄りになってしまいます。 background-position:center;などを 入れてみましたが、変化なし、でした。 根本的な間違いでもしているのでしょうか。 ご経験おありの方、ご存知の方お教えください。 ※客観的に説明できるように努力していますが 足らない部分があれば、お伝えください。
- ベストアンサー
- XML
- CSSを使って、背景色をブラウザの縦100％につづかせたいです。
こんにちは。おせわになります。 CSSを使って、左側に同じ背景色がブラウザの縦いっぱいにつづき、 右側に、たくさんの文字や画像をのせるレイアウトをしたいと思ってます。 しかし、どうやっても左の背景が縦100％になりません。 右のテキストの量が少なければ、問題ないのですが、多いとむりです。 グーグルなどでも調べましたが、どうしてもわからないです。 とてもこまってます。よろしくお願いします。 （ソース例の「たくさんの文字」というところには、多くの文字と写真が入ります。） --------------------------- CSS↓ html{ height:100%; } body{ height:100%; width:100%; } .b1 { background-color: #333333; height: 100％; width: 100px; float: left; } .b2 { background-color: #99CC33; height: 100%; width: 200px; float: left; } BODY内↓ <div class="b1">文字</div> <div class="b2"> たくさんの文字</div>
- 締切済み
- ホームページ作成ソフト
