例えば、下記のように記述して「wrapper」ボックスで
「bodybg.gif」という画像を垂直方向に並べたいのですが、IE6ではうまく表示されますが、NN7.01だとヘッダー部分以外のボックスに背景画像が表示されません(><;)
/* html * /
<div id="wrapper">
<div id="header"></div> /* ヘッダー */
<div id="pagebody"> /* pagebody内2カラム */
<div id="content"></div> /* 右寄せ */
<div id="leftside"></div> /* 左寄せ */
</div>
</div>
/* css * /
#wrapper {
width: 600px;
margin-left: auto;
margin-right: auto;
margin:0px;
background: url(../img/bodybg.gif) repeat-y;
padding: 0px;
}
CSSで毎回つまづくところですが、どうにもこうにも対処方法が見つかりません(T_T)
どなたか力をかしていただけないでしょうか・・・
No.1ベストアンサー
- 回答日時:
最後の</div>の手前に
<div style="clear:both;"></div>
を入れてみるとか。
参考URL:http://allabout.co.jp/computer/hpcreate/closeup/ …
早速有難うございました!m(_ _)m
参考サイトを見て下記のように書き直してみて、
成功しました!有難うございました。
/* html * /
<div id="wrapper">
<div id="header"></div> /* ヘッダー */
<div id="pagebody"> /* pagebody内2カラム */
<div id="content"></div> /* 右寄せ */
<div id="leftside"></div> /* 左寄せ */
</div>
<div class="clear"></div>
</div>
/* css * /
#wrapper {
width: 600px;
margin-left: auto;
margin-right: auto;
margin:0px;
background: url(../img/bodybg.gif) repeat-y;
padding: 0px;
}
.clear {
clear: both;
}
しかし、wrapperで背景を貼り付けるのがレイアウト上まずくなったので、
background: url(../img/bodybg.gif) repeat-y;
の記述をwrapperからpagebodyに変えると、またNNでは背景が表示されない・・・ということになりました(--;)
NNのキャッシュをクリアしたりしたのですが、
どうもうまくいきません。こんなに苦労するならCSSなんてあっさりやめれば楽なんですが・・・
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- HTML・CSS 吹き出し 下記の吹き出しのスタイルシートについて 下記のスタイルシートは左側にアイコンがでる使用にな 1 2022/11/12 17:55
- HTML・CSS PCサイズで赤い画像2つと、青い画像2つがそれぞれ横に2つずつ並んでいるのですが、これをスマホサイズ 5 2022/04/11 12:01
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
離れた場所にマウスオーバーで...
-
1行で左寄せと右寄せと中央揃え...
-
文字を固定したいのですが…
-
Ctrl+F(検索)の窓を出したいの...
-
CSSでdivのheightを動的に
-
css固定したフッターが本文と重...
-
文字をクリックしたら別の文字...
-
CSS <div>の入れ子が反映さ...
-
CSS 可変マージン
-
スクロール可能なチェックボックス
-
<div valign=bottom> は効かな...
-
clear: bothの事で質問です。
-
追加記入もできるプルダウンメ...
-
★★★フッター最下部固定/スクロ...
-
オンマウス時に別画像を上に重...
-
左○○px、右は残りの幅(100%-左...
-
HTMLですCSSです 画像のように...
-
MAX関数を使ってからLEFT JOIN...
-
c++std::string型をTCHARに変換...
-
htmlの記述で link rel=styles...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Ctrl+F(検索)の窓を出したいの...
-
フッター上部に謎の隙間
-
【CSS】floatで左右に並べた...
-
HTMLですCSSです この画像のよ...
-
css固定したフッターが本文と重...
-
CSS <div>の入れ子が反映さ...
-
スクロール可能なチェックボックス
-
textareaで入力した文字を改行...
-
オンマウス時に別画像を上に重...
-
文字を固定したいのですが…
-
スタイルシートで画面を上下に...
-
チェックボックスの背景色って...
-
フッターの下に隙間ができてしまう
-
文字をクリックしたら別の文字...
-
大分類・中分類・小分類
-
HTMLですCSSです 画像のように...
-
CSSでdivのheightを動的に
-
★★★フッター最下部固定/スクロ...
-
離れた場所にマウスオーバーで...
-
htmlのstyleのposition:relativ...
おすすめ情報